确定进度的进度条

 

 

HTML

1	<div class="load-tip">

2	<div class="load-num"></div>

3

</div>

CSS

1	.load-tip{padding:1px;width:246px;height:10px;border:1px solid #b7b7b7;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;overflow:hidden;}

2	.load-num{width:100%;height:10px;background:#ffa31a;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;-webkit-transition:width .5s ease-out;-moz-transition:width .5s ease-out;transition:width .5s ease-out;}

(注：改变 class="load-num" 的宽度的百分比)