timeline自适应时间轴
近期项目一直有类似QQ空间那样的时间轴,来展示公司新闻动态,或者流程之类的设计UI。
每每出现,不以为然,这次总结了下,精简下
=================
===================
<li>
<h4>1.下载APP</h4>
<p></p>
</li>
==============
.process-list li h4:before {
content: '';
display: block;
position: absolute;
left: 0;
top: -6px;
margin-left: -13px;
width: 24px;
height: 24px;
background-size: 24px 24px;
}
.process-list li:nth-child(1) h4:before {
width: 24px;
height: 24px;
background: url(../bgimg/icon-process-list1.png) no-repeat center center;
background-size: 24px 24px;
}
===========================
下载地址:https://files.cnblogs.com/files/leshao/timeline.rar
作为工作备忘录而已!