伪元素实现竖线

需求：

在每个小标题后面添加竖线，且最后一个小标题不需要竖线

先看效果

实现

html部分

 <div class="sub-title">
	 <span>机票</span>
	 <span>火车票</span>
	 <span>酒店</span>
</div>

css部分

.sub-title {
  span:not(:last-child)::after {
    display: inline-block;
    height: 22px;
    margin: 0 10px 2px;
    vertical-align: middle;
    border-right: 10px solid green;
    content: '';
  }
}