利用css样式表,动态生成箭头样式
最近公司新上一个项目,Vue架构。碰到一个小问题,虽然小,但是最后的解决方法却很妙。
如图所示:
图中阶段为后台动态获得,获取每一个阶段后,需要添加箭头,由于阶段框为动态获取,所以箭头需要动态添加。此时采用css样式表单完成上述动态添加箭头的功能,即相当于在每一个框的后面添加箭头。
ul li:after {
content: '';
width: 20px;
height: 18px;
background: url("../img/arr-line.png") no-repeat;
}
在ul li:after{}内部添加箭头背景图,可以实现在每一个ul或者li的标签后面动态添加箭头……同样可以类比其他很多功能,不仅仅是箭头标签等等。