.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 關注
- 848 瀏覽
添加回答
舉報
0/150
提交
取消