php中li标签技巧_网站前端开拓运用CSS伪元素before实现li与li之间的分隔符

实现办法

css样式写法 li+li:before{content: \公众|\"大众;}即可，则要加空隙写上padding: 0 20px;。

CSS样式

.header ul{float: right;line-height: 60px;padding: 0px 30px;}.header ul li{float: left; font: 16px; list-style: none;}.header ul li+li:before { padding: 0 20px; color: #ddd;content: \"大众|\公众;}

HTML

<div class=\公众header\公众><div class=\"大众menu\"大众><ul><li>网站前台</li><li>站内信息</li><li>管理员：Mr.Yang</li><li>设置</li></ul></div></div>

浏览效果