CSS3的前綴是一個(gè)瀏覽器生產(chǎn)商經(jīng)常使用的一種方式期贫。它暗示該CSS屬性或規(guī)則尚未成為W3C標(biāo)準(zhǔn)的一部分棠耕。
以下是幾種常用前綴
-webkit
-moz
-ms
-o
CSS3前綴+標(biāo)準(zhǔn)代碼的順序
先寫私有的CSS3屬性枚驻,再寫標(biāo)準(zhǔn)的CSS3屬性拓哺。
如:
-webkit-transform:rotate(-3deg); /*為Chrome/Safari*/
-moz-transform:rotate(-3deg); /*為Firefox*/
-ms-transform:rotate(-3deg); /*為IE*/
-o-transform:rotate(-3deg); /*為Opera*/
transform:rotate(-3deg); /*為nothing*/
去掉CSS3前綴
什么時(shí)候我們可以去掉一個(gè)屬性的CSS3前綴呢比伏?答案是弥锄,當(dāng)一個(gè)屬性成為標(biāo)準(zhǔn)沼侣,并且被Firefox祖能、Chrome等瀏覽器的最新版普遍兼容的時(shí)候。
以border-radius為例:
-moz-border-radius: 12px; /* FF1-3.6 */
-webkit-border-radius: 12px; /* Saf3-4, iOS 1-3.2, Android <1.6 */
border-radius: 12px; /* Opera 10.5, IE9, Saf5, Chrome, FF4, iOS 4, Android 2.1+ */