1、html
<div> <span class="status-all status-active status-normal">全部</span> <span class="status-other status-normal">待确认</span> <span class="status-other status-normal">已成功</span> </div>
2、css
.status-all.status-active:after { content: ''; position: absolute; width: 16px; height: 2px; left: 25%; bottom: 0; background-color: #4572ED; } .status-other.status-active:after { content: ''; position: absolute; left: 25%; bottom: 0; height: 2px; width: 24px; background-color: #4572ED; }
效果如下图:
---------------------
作者:小小青柠檬
来源:CSDN 原文:https://blog.csdn.net/tanqiaoxing/article/details/80167564