<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>渐变线</title>
<style>
#divId {
height: 200px;
background: -webkit-linear-gradient(black, white,black);
}
</style>
</head>
<body>
<h3>线性渐变 - 从上到下</h3>
<p>从顶部开始的线性渐变。起点颜色慢慢改变</p>
<div style="background:black;height:200px;width:200px">
<div id="divId" style="height:200px;width:2px;margin:0 auto">
</div>
</div>
</body>
</html>
显示效果:

网友评论