此作品是JquerySchool网站站长漫画最近做项目时写的一款原创html5+css3实现响应式时间进度条特效,是用最原始的html5标签和css3样式写的,没有用到jquery和原生javascript,作品代码简洁,使用简单,可以直接用到任何项目和页面中,响应式支持任何设备访问,大家好好利用哦。。。
页面结构代码如下:
<main class="projectmain">
<section>
<div id="time_axis">
<div id="member"><img src="images/member.png" />
<h2>漫画 </h2>
<h2>jquery改变生活</h2>
</div>
<div class="clear"></div>
<div id="jingzhan">
<div class="time t_cur">
<div class="t_1">2013.06</div>
<div class="t_2"></div>
<div class="t_3">Jquery学堂成立</div>
</div>
<div class="time t_cur">
<div class="t_1">2013.07</div>
<div class="t_2"></div>
<div class="t_3">JquerySchool网站上线</div>
</div>
<div class="time t_cur">
<div class="t_1">2013.08</div>
<div class="t_2"></div>
<div class="t_3">网友分享原创</div>
</div>
<div class="time t_cur">
<div class="t_1">2013.09</div>
<div class="t_2"></div>
<div class="t_3">网友在线学习</div>
</div>
<div class="time">
<div class="t_1">2013.10</div>
<div class="t_2"></div>
<div class="t_3">官方QQ群创建(272329133)</div>
</div>
<div class="time">
<div class="t_1">2013.11</div>
<div class="t_2"></div>
<div class="t_3">在线API上线</div>
</div>
</div>
</div>
</section>
</main>
效果如下:
如果您觉得本作品对您的学习有所帮助:
关键字:
html5 css3 响应式 进度条特效