CSS是前端開發中不可或缺的一部分,經常用來設置網頁的樣式。在不同的瀏覽器上,可能會出現樣式不一致的問題,這時候我們可以使用CSS根據瀏覽器設置屬性。
/*根據不同的瀏覽器設置背景顏色*/ body{ background-color: red; /*默認背景顏色*/ -webkit-background-color: blue; /*針對Chorme和Safari瀏覽器*/ -moz-background-color: green; /*針對Firefox瀏覽器*/ -o-background-color: yellow; /*針對Opera瀏覽器*/ }
對于一些CSS3的新屬性,不同的瀏覽器可能會有不同的前綴,我們也可以使用這種方式來兼容不同瀏覽器。
/*根據不同的瀏覽器設置圓角*/ div{ border-radius: 10px; /*默認圓角*/ -webkit-border-radius: 10px; /*針對Chorme和Safari瀏覽器*/ -moz-border-radius: 10px; /*針對Firefox瀏覽器*/ -o-border-radius: 10px; /*針對Opera瀏覽器*/ }
除了以上例子中用到的瀏覽器前綴外,還有一些其他的瀏覽器前綴:
- -ms-:針對IE瀏覽器
- -atsc-:針對電視設備
- -wap-:針對WAP
CSS根據瀏覽器設置屬性是前端開發中常用的技巧,但是這樣的方法并不是萬能的,有時也會出現問題。所以我們還需使用其他的方法來解決問題,如使用CSS hack或者使用JavaScript特性檢測等方法。
上一篇css樣式重要
下一篇django渲染css