用css3动画去做 00.xian{ width:50px; height:1px; background:#000000; margin-top:100px;}.xian{animation: myfirst 5s;}@keyframes myfirst{from {width: 50px;}to {width: 1000px;}}低版本浏览器不支持css3属性，用谷歌什么的高版本浏览器看。实现是实现了，但是可能有...
css怎么实现一条直线向右逐渐延伸显示
实现是实现了，但是可能有些蠢。你看看行不。
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title><style type="text/css"> .container{ width: 100%; height: 2px; box-sizing: border-box; } .line{ float: left; padding: 0; margin: 0; width: 2px; height: 2px; background: red; -webkit-animation: test 3s linear 0s 1 alternate; -moz-animation: test 3s linear 0s 1 alternate; -o-animation: test 3s linear 0s 1 alternate; animation: test 3s linear 0s 1 alternate; -webkit-animation-fill-mode: forwards; -moz-animation-fill-mode: forwards; -o-animation-fill-mode: forwards; animation-fill-mode: forwards; } .line:last-child{ border-right: 1px solid blueviolet; } @-webkit-keyframes test { 0%{ width: 2px; } 10%{ width: 3px; } 20%{ width: 4px; } 30%{ width: 5px; } 40%{ width: 6px; } 50%{ width: 7px; } 60%{ width: 8px; } 70%{ width: 9px; } 80%{ width: 10px; } 90%{ width: 11px; } 100%{ width: 12px; } }</style></head><body><div class="container"> <div class="line"></div> <div class="line"></div> <div class="line"></div> <div class="line"></div> <div class="line"></div> <div class="line"></div></div></body></html>2016-05-23
用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属性，用谷歌什么的高版本浏览器看。
2017-09-01
进度条形式做
2020-01-16
什么意思，就像进度条那样么？2016-05-23
