CSS3 渐变（Gradients）之CSS3 线性渐变(6)

发布时间：2020-03-15 08:06 所属栏目：52 来源：站长网

导读：background:-webkit-linear-gradient(red,orange,yellow,green,blue,indigo,violet);/*Safari5.1-6.0*/ background:-o-linear-gradient(red,orange,yellow,green,blue,indigo,violet);/*Opera11.1-12.0*/ backgroun

background: -webkit-linear-gradient(red, orange, yellow, green, blue, indigo, violet); /* Safari 5.1 - 6.0 */

background: -o-linear-gradient(red, orange, yellow, green, blue, indigo, violet); /* Opera 11.1 - 12.0 */

background: -moz-linear-gradient(red, orange, yellow, green, blue, indigo, violet); /* Firefox 3.6 - 15 */

background: linear-gradient(red, orange, yellow, green, blue, indigo, violet); /* 标准的语法（必须放在最后） */

}

#grad3 {

width:300px;

height:80px;

background: -webkit-linear-gradient(red 10%, green 85%, blue 90%); /* Safari 5.1 - 6.0 */

background: -o-linear-gradient(red 10%, green 85%, blue 90%); /* Opera 11.1 - 12.0 */

background: -moz-linear-gradient(red 10%, green 85%, blue 90%); /* Firefox 3.6 - 15 */

background: linear-gradient(red 10%, green 85%, blue 90%); /* 标准的语法（必须放在最后） */

}

</style>

</head>

<body>

<h4>3 个颜色结点（均匀分布）</h4>

（编辑：ASP站长网）