明白了为啥样式前面老是加 -webkit-、-moz-等

时间:2021-04-07 20:26:40

例子:

<strong><span style="font-size:18px;">background-color:#42c264;</span></strong>
<strong><span style="font-size:18px;">background-image:-webkit-linear-gradient(#4fec50,#42c264);</span></strong>
<pre name="code" class="css"><strong><span style="font-size:18px;">background-image:-moz-linear-gradient(#4fec50,#42c264);</span></strong>
<strong><span style="font-size:18px;">background-image:-o-linear-gradient(#4fec50,#42c264);</span></strong>
<strong><span style="font-size:18px;">background-image:-ms-linear-gradient(#4fec50,#42c264);</span></strong>
<strong><span style="font-size:18px;">background-image:-chrome-linear-gradient(#4fec50,#42c264);</span></strong>
<strong><span style="font-size:18px;">background-image:linear-gradient(#4fec50,#42c264);</span></strong>

 
上面的代码效果是,先给出一个纯色的背景色,如果浏览器支持linear-gradient渐变色效果样式,就进行渐变。而前面加了很多前缀,如-webkit-,-moz-,-o-,-ms-,-chrome-等都是为了支持非正式发布版的浏览器。一般正式发布版如果支持linear-gradient都不会加前缀的,只有非正式发布版,在测试阶段才添加前缀。