CSS3的漸變屬性的疑惑
問題描述
background: -webkit-gradient(linear, 0% 20%, 0% 1000%, from(#fff), to(#fff), color-stop(.1,#f3f3f3));
沒見過這種語法格式欸,有點不懂什么啥意思
見過的都是這種格式background: linear-gradient(direction, color-stop1, color-stop2, ...);
關于第一種格式希望大神能解析一下并且推薦一些資料謝謝!
問題解答
回答1:這是webkit內核漸變的老式書寫規則:-webkit-gradient(<type>, <point> [, <radius>]?, <point> [, <radius>]? [, <stop>]*) //老式語法書寫規則;例如:background: -webkit-gradient(linear,center top,center bottom,from(#ccc), to(#000));
回答2:webkit-是兼容前綴,它告訴-webkit-內核的瀏覽器采用自己的方法來實現后綴后面的樣式,一般完整的兼容前綴是:
{ -webkit-style: value; -moz-style: value; -ms-style: value; -o-style: value; style: value;}
這樣瀏覽器就能自動識別支持的那一個樣式。比如用chrome,它是-webkit-內核,因此只識別-webkit-前綴的樣式和沒有前綴的樣式。-webkit-前綴告訴chrome用自己的實現方式渲染漸變,但最終樣式依然由沒有前綴的樣式決定。
相關文章:
1. html - vue項目中用到了elementUI問題2. mysql scripts提示 /usr/bin/perl: bad interpreter3. showpassword里的this 是什么意思?代表哪個元素4. css3 - border-bottom 的長度可否超過盒子的寬度呢?實現如下圖效果。(我的書下面的線)5. android - 用textview顯示html時如何寫imagegetter獲取網絡圖片6. 對mysql某個字段監控的功能7. css3 - css怎么實現圖片環繞的效果8. javascript - 原生canvas中如何獲取到觸摸事件的canvas內坐標?9. JavaScript事件10. mysql優化 - mysql EXPLAIN之后怎么看結果進行優化 ?
