河南省建设教育培训中心网站,泰州哪家做网站建设比较好,海南所有的网站建设类公司,安阳网站建设哪家好CSS渐变在Webkit率先得到实现#xff0c;现在Firefox 3.6也支持了#xff0c;来看下各个浏览器如何实现CSS渐变效果。 Webkit 下面这行代码可用于Chrome, Safari等#xff0c;它能实现线性渐变#xff0c;从top(#ccc)渐变到bottom(#000)。 background: -webkit-gradient(li…CSS渐变在Webkit率先得到实现现在Firefox 3.6也支持了来看下各个浏览器如何实现CSS渐变效果。 Webkit 下面这行代码可用于Chrome, Safari等它能实现线性渐变从top(#ccc)渐变到bottom(#000)。 background: -webkit-gradient(linear, left top, left bottom, from(#ccc), to(#000));Firefox 3.6 background: -moz-linear-gradient(top, #ccc, #000);IE IE这个垃圾需要使用滤镜 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr#cccccc, endColorstr#000000);跨浏览器的渐变代码 把上面三行代码合在一起就是一段跨浏览器的渐变代码。注意我在开头加了一个background以防用户使用的浏览器不支持这些特性。 background: #999; /* for non-css3 browsers */filter: progid:DXImageTransform.Microsoft.gradient(startColorstr#cccccc, endColorstr#000000); /* for IE */
background: -webkit-gradient(linear, left top, left bottom, from(#ccc), to(#000)); /* for webkit browsers */
background: -moz-linear-gradient(top, #ccc, #000); /* for firefox 3.6 */ IE的限制 IE的渐变滤镜不支持 color-stopgradient angleradial gradient。也就是说你只能实现水平或垂直的渐变渐变色也只有2种StartColorStr 和 EndColorStr。 最后的温馨提示 不是所有浏览器都支持CSS渐变。为了保险起见你最好不要依赖它只能把它当作加分的东西。如果你像我玩博客一样面向的都是ChromeFirefox往死里用吧转载于:https://www.cnblogs.com/zhujl/archive/2011/10/01/2197112.html
