css3灰色渐变

CSS3提供了一种非常逼真的灰色渐变效果，可以让网页设计更加美观，吸引人眼球。下面我们就来介绍如何使用CSS3实现灰色渐变。

.grad_bg {
    background: -webkit-linear-gradient(top, #808080, #e6e6e6);
     /* Safari 5.1-6.0 */background: -o-linear-gradient(top, #808080, #e6e6e6);
     /* Opera 11.1-12.0 */background: -moz-linear-gradient(top, #808080, #e6e6e6);
     /* Firefox 3.6-15 */background: linear-gradient(to bottom, #808080, #e6e6e6);
 /* 标准语法 */}
    

上面的代码定义了一个名为“grad_bg”的CSS类，其中使用了四个不同浏览器的前缀来支持不同浏览器对渐变的实现方式。我们可以将该类作用于任何需要使用灰色渐变的元素上，如下：

div class="grad_bg">
    p>
    这里是灰色渐变的内容/p>
    /div>
    

此时，该div中的文字内容就会被渲染成从浅灰到深灰的渐变效果，十分美观大方。我们也可以通过修改CSS样式表中的渐变颜色值，来实现自己想要的灰色渐变效果。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！