html - 这种错位的时间轴怎么布局，然后用css实现？

问题描述

如图

主要是左边的图标是错位的，本来想用ul、li实现的。现在第一个和最后一个有问题，第一个倒很好解决，但是最后一个怎么实现图标下面没有线？或者有没有更好的布局方式

问题解答

最后一个没有线，可以用jq的last-child 选择器去掉

可以直接用内联样式写死吧

那条线使用border来模拟，最后一个元素的border为0

样式 last-child 选择器去掉

分为左右两栏，左边那条竖线，用绝对定位实现，右边用li标签，线段使用border即可，如果使用类似border-top:1px solid #aaa;的话，则用li:first-child{border-top:none;},如果使用border-bottom则使用:last-child