在“網(wǎng)頁制作：初步了解CSS3（2）-web前端”的文章中已經(jīng)給大家簡單的介紹了一些CSS3的屬性！
現(xiàn)在給大家再繼續(xù)介紹一些CSS3的有趣屬性
skew() //通過 skew() 方法，元素翻轉(zhuǎn)給定的角度，根據(jù)給定的水平線（X 軸）和垂直線（Y 軸）參數(shù)
例如：
div
{
? ? ? ? ? ? ? transform: skew(30deg,20deg);
? ? ? -ms-transform: skew(30deg,20deg);? ? /* IE 9 */
-webkit-transform: skew(30deg,20deg);? ? /* Safari and Chrome */
? ? ? ? -o-transform: skew(30deg,20deg);? ? /* Opera */
? ? -moz-transform: skew(30deg,20deg);? ? /* Firefox */
}
值 skew(30deg,20deg) 圍繞 X 軸把元素翻轉(zhuǎn) 30 度，圍繞 Y 軸翻轉(zhuǎn) 20 度。
matrix() //matrix() 方法把所有 2D 轉(zhuǎn)換方法組合在一起。matrix() 方法需要六個(gè)參數(shù)，包含數(shù)學(xué)函數(shù)，允許您：旋轉(zhuǎn)、縮放、移動(dòng)以及傾斜元素。
如何使用 matrix 方法將 div 元素旋轉(zhuǎn) 30 度
例如：
div
{
? ? ? ? ? ? ? transform:matrix(0.866,0.5,-0.5,0.866,0,0);
? ? ? -ms-transform:matrix(0.866,0.5,-0.5,0.866,0,0);? ? ? ? /* IE 9 */
? ? -moz-transform:matrix(0.866,0.5,-0.5,0.866,0,0);? ? /* Firefox */
-webkit-transform:matrix(0.866,0.5,-0.5,0.866,0,0);? ? /* Safari and Chrome */
? ? ? ? -o-transform:matrix(0.866,0.5,-0.5,0.866,0,0);? ? ? ? /* Opera */
}
3D 轉(zhuǎn)換
rotateX()? //通過 rotateX() 方法，元素圍繞其 X 軸以給定的度數(shù)進(jìn)行旋轉(zhuǎn)。
例子：
div
{
? ? ? ? ? ? ? transform: rotateX(120deg);
-webkit-transform: rotateX(120deg);? ? /* Safari 和 Chrome */
? ? -moz-transform: rotateX(120deg);? ? /* Firefox */
}
rotateY()? //通過 rotateY() 方法，元素圍繞其 Y 軸以給定的度數(shù)進(jìn)行旋轉(zhuǎn)。
例子：
div
{
? ? ? ? ? ? ? transform: rotateY(130deg);
-webkit-transform: rotateY(130deg);? ? /* Safari 和 Chrome */
? ? -moz-transform: rotateY(130deg);? ? /* Firefox */
}
CSS3還有許多有趣的屬性，但是由于現(xiàn)在CSS3還存在一些兼容性的問題，某些瀏覽器會(huì)有不兼容的情況，所以大家寫網(wǎng)頁的時(shí)候需要更具實(shí)際的情況來使用，切勿濫用！
CSS3的屬性用于手機(jī)網(wǎng)站比較多點(diǎn)，PC端的網(wǎng)站根據(jù)實(shí)際情況來使用比較好！
