假如你現在正學習着強大的Css3,你知道Css3的很多數屬性為實驗屬性,使用他們的時候得加上各式各樣的瀏覽器前綴。可能你默默忍受了,因為還沒到統一的時間。有沒想過給自己減下負,偶然間在網上看到一個js解決方案,正好可以解決這個問題。他會幫你自動識別瀏覽器,生成對應的Css3樣式前綴,這樣你就可以直接當作標准屬性來使用了。
舉個例子:
原先:
-webkit-transform: rotate(15deg);
-o-transform: rotate(15deg);
-moz-transform: rotate(15deg);
-ms-transform: rotate(15deg);
-webkit-border-radius: 50%;
-o-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
現在:
transform: rotate(15deg);
border-radius: 50%;
是不是很棒,使用方法也很簡單,簡單到和平常引用jQuery一樣,不用任何配置,而且文件大小也僅有幾K。
引用方式:<script src=”http://leaverou.github.com/prefixfree/prefixfree.min.js”></script>
該js項目地址為http://leaverou.github.com/prefixfree/。事物總是有兩面性,帶來方便的同時,也引入了一些問題,因為是基於js的,所以對於一些不支持或者禁用js的瀏覽器用戶是很不友好的,很可能會打亂布局,而且有時候會影響你使用Css的一些技巧(比如你只是想針對某個瀏覽器使用某個Css3屬性,由於這個js的作用,所有瀏覽器都會應用該條屬性,明顯這不是你想要的結果)
總結:用於學習練手我很贊成(少敲了好多代碼哈哈),用於實際項目的話還是得考慮清楚其中的得失利弊。
