css 文字两边 横线 |css点击弹出隐藏层

p::before {
content: "";
border-top: 1px solid #000;
display: block;
margin-bottom: 10px;
}
p::after {
content: "";
border-top: 1px solid #000;
display: block;
margin-top: 10px;
}

这段代码中，大家使用了两个伪元素::before和::after来分别给文本添加上横线。在::before伪元素中，大家设置了边框为1个像素的实线，颜色为黑色，并让它显示在文本之前，同时给伪元素添加一个块级元素的display属性，这样子的话，横线就可以占据一整行的宽度了。而在::after伪元素中，大家同样设置了边框为1个像素的实线，颜色也是黑色，并让它显示在文本之后，然后再加上一个10像素的margin-top来让它和文本之间有一定的距离。

这样就可以给文本两边都添加上横线了。当然，你可以根据自己的需要来修改这些样式。