CSS3新增的屬性有哪些

1、css3新增的屬性有哪些css 用于控制網(wǎng)頁(yè)的樣式和布局。css3 是最新的 css 標(biāo)準(zhǔn)。css3新增了無(wú)數(shù)的屬性，下面一起來(lái)分析一下新增的一些屬性：1.css3邊框：border-radius：css3圓角邊框。在 css2 中添加圓角矩形需要技巧，我們必需為每個(gè)圓角用法不同的，在 css3 中，創(chuàng)建圓角是十分簡(jiǎn)單的，在 css3 中，border-radius 屬性用于創(chuàng)建圓角。border：2px solid;box-shadow：css3邊框陰影。在 css3 中，box-shadow 用于向方框添加陰影。box-shadow:10px 10px 5px 888888;border-

2、image：css3邊框。通過(guò) css3 的 border-image 屬性，您可以用法來(lái)創(chuàng)建邊框。border-image：url(border.png) 30 30 round;2.css3背景：background-size： 屬性規(guī)定背景的尺寸。在 css3 之前，背景的尺寸是由的實(shí)際尺寸打算的。在 css3 中，可以規(guī)定背景的尺寸，這就允許我們?cè)诓煌沫h(huán)境中重復(fù)用法背景。您能夠以像素或百分比規(guī)定尺寸。假如以百分比規(guī)定尺寸，那么尺寸相對(duì)于父元素的寬度和高度。background-origin ：屬性規(guī)定背景的定位區(qū)域。背景可以放置于 content-box、padding-box 或

3、border-box 區(qū)域。3.css3文字效果：text-shadow：在 css3 中，text-shadow 可向文本應(yīng)用陰影。text-shadow:5px 5px 5px ffffff;word-wrap :單詞太長(zhǎng)的話就可能無(wú)法超出某個(gè)區(qū)域，允許對(duì)長(zhǎng)單詞舉行拆分，并換行到下一行：pword-wrap:break-word;4.css3 2d轉(zhuǎn)換：transform：通過(guò) css3 轉(zhuǎn)換，我們能夠?qū)υ嘏e行移動(dòng)、縮放、轉(zhuǎn)動(dòng)、拉長(zhǎng)或拉伸。translate()：元素從其當(dāng)前位置移動(dòng)，按照給定的 left（x 坐標(biāo)） 和 top（y 坐標(biāo)） 位置參數(shù)：transform：translat

4、e（50px,100px）;值 translate(50px,100px) 把元素從左側(cè)移動(dòng) 50 像素，從頂端移動(dòng) 100 像素。rotate()：元素順時(shí)針旋轉(zhuǎn)給定的角度。允許負(fù)值，元素將逆時(shí)針旋轉(zhuǎn)。transform:rotate(30deg);值 rotate(30deg) 把元素順時(shí)針旋轉(zhuǎn) 30 度。scale():元素的尺寸會(huì)增強(qiáng)或削減，按照給定的寬度（x 軸）和高度（y 軸）參數(shù)：transform:scale(2,4);值 scale(2,4) 把寬度轉(zhuǎn)換為原始尺寸的 2 倍，把高度轉(zhuǎn)換為原始高度的 4 倍。skew():元素轉(zhuǎn)動(dòng)給定的角度，按照給定的水平線（x 軸）和垂直線（

5、y 軸）參數(shù)：transform:skew(30deg,20deg);值 skew(30deg,20deg) 圍繞 x 軸把元素轉(zhuǎn)動(dòng) 30 度，圍繞 y 軸轉(zhuǎn)動(dòng) 20 度。matrix() :matrix() 辦法把全部 2d 轉(zhuǎn)換辦法組合在一起。matrix() 辦法需要六個(gè)參數(shù)，包含數(shù)學(xué)函數(shù)，允許您：旋轉(zhuǎn)、縮放、移動(dòng)以及傾斜元素。5.css3 3d轉(zhuǎn)換：rotatex()：元素圍繞其 x 軸以給定的度數(shù)舉行旋轉(zhuǎn)。transform：rotatex(120deg);rotatey()：元素圍繞其 y 軸以給定的度數(shù)舉行旋轉(zhuǎn)。transform：rotatey(120deg);6.css3 過(guò)渡：當(dāng)元素從一種樣式變換為另一種樣式時(shí)為元素添加效果。7.css3動(dòng)畫(huà)：通過(guò) css3，我們能夠創(chuàng)建動(dòng)畫(huà)，這可以在許多網(wǎng)頁(yè)中取代動(dòng)畫(huà)、flash 動(dòng)畫(huà)以及 javascript。8.css3多列：column-count：屬性規(guī)定元素應(yīng)當(dāng)被分隔的列數(shù)。column-gap：屬性規(guī)定列之間的間隔。column-rule ：屬性設(shè)置列之間的寬度、樣式和色彩規(guī)章。9.css3用戶界面：resize：屬性規(guī)定是否可由用戶調(diào)節(jié)元素尺寸。