如何用css实现一条直线渐变效果

来源:互联网 发布:网络上的白云先生是谁 编辑:程序博客网 时间:2024/05/20 23:03
#grad1 {    background: -webkit-linear-gradient(left, rgba(251, 251, 251, 0.09),rgba(251, 251, 251, 0.59),#FFF); /* Safari 5.1 - 6.0 */    background: -o-linear-gradient(right, rgba(251, 251, 251, 0.09),rgba(251, 251, 251, 0.59) ,#FFF); /* Opera 11.1 - 12.0 */    background: -moz-linear-gradient(right,rgba(251, 251, 251, 0.09),rgba(251, 251, 251, 0.59) ,#FFF); /* Firefox 3.6 - 15 */    background: linear-gradient(to right, rgba(251, 251, 251, 0.09),rgba(251, 251, 251, 0.59),#FFF); /* 标准的语法(必须放在最后) */    height: 6px;}

线性渐变(Linear Gradients)- 向下/向上/向左/向右/对角方向;
径向渐变(Radial Gradients)- 由它们的中心定义

原创粉丝点击