用css3动画去做
<!doctype html><html>
<head>
<meta charset="utf-8">
<title>00</title>
<style>
.xian{ width:50px height:1px background:#000000 margin-top:100px}
.xian{animation: myfirst 5s}
@keyframes myfirst
{
from {width: 50px}
to {width: 1000px}
}
</style>
</head>
<body>
<div class="xian"></div>
</body>
</html>
低版本浏览器不支持css3属性，用谷歌什么的高版本浏览器看。
可以，border style 有groove 凹槽
ridge 垄状
inset inset
outset outset
当然是用border的前提下，这几个style用其中一个即可，效果取决于颜色
不过说点多余的，你给的颜色和线条不仔细看看不出来，所以意义不大
另外的做法就是老的hr，不过现在没什么人用了，还是用别的标签做border比较灵活
