使用div实现progress进度条

在百度上搜了很多方法去修改HTML5 progress的样式,然而并没有实现。
所以自己用div实现了一个。

简单粗暴(*^-^*)  可以在CSS里改样式,可以JS里改进度。

<div class="timepro">
	<div class="timepro-go" style="width:10%"></div>
</div>


.timepro{
	height:5px;
	background:#ccc;
	width:95%;
	border-radius:10px;
	-webkit-border-radius:10px;
	position: relative;
}
.timepro-go{
	width:0%;
	background:#000;
	height:5px;
	border-radius:10px;
	-webkit-border-radius:10px;
	position: relative;
	transition: all 10s;
	-webkit-transition: all 10s;
}


posted @ 2016-11-07 13:52  hiuman  阅读(673)  评论(0编辑  收藏  举报