.linear { position: relative; height: 1px; width: 100%; background: -webkit-linear-gradient(left,#fff 20%,#000 60%,#fff 20%);}结果就变成了这样：不知道哪里出现了问题？
2 回答
喵喵时光机
TA贡献1846条经验 获得超7个赞
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>CSS3 Linear Gradients</title>
<style>
.classname {
background: -webkit-linear-gradient( 90deg, #ffffff 10%, #bdbdbd 50%, #ffffff 90%) ;
background: -o-linear-gradient( 90deg, #ffffff 10%, #bdbdbd 50%, #ffffff 90%) ;
background: -moz-linear-gradient( 90deg, #ffffff 10%, #bdbdbd 50%, #ffffff 90%) ;
background: linear-gradient( 90deg, #ffffff 10%, #bdbdbd 50%, #ffffff 90%) ;
padding:10px 0;
text-align:center;
}
</style>
</head>
<body>
<div class="classname">
CSS Gradient
</div>
</body>
</html>
兼容性: IE10及以上
泛舟湖上清波郎朗
TA贡献1818条经验 获得超3个赞
用法：-webkit-linear-gradient(left,#fff 20%,#000 60%, #fff);
颜色断点后面跟着百分比，是整个线性距离的百分比，所以，最前面应该是 0%，最后是 100%，其余百分比依次递增。
0% 与 100% 可以省略不写。
- 2 回答
- 0 关注
- 800 浏览
添加回答
举报
0/150
提交
取消