before与after是css中的两个伪元素。所谓的伪元素就是一个虚假的元素，并插入到目标元素内容的之前与之后，我们一般可以通过css来控制它。其实before与after的编码是非常的简单的，就像我们在css中对他进行操作，比如设置他的背景颜色、设置它的大小、设置他的定位等等。只不过伪元素多加了一个content属性，如果我们对他不进行设置，那么我们设置的伪元素就会不起作用，我们可以设置content的内容为一个空字符串
content当我们添加的content为字符串的时候，字符串作为伪元素的内容添加到主元素中，这个字符串是直接原样输出内容，里面即使有html的转义符，也不会被转译。
#css代码
.a {
width: 100px;
height: 100px;
margin-left: 20px;
background-color: #eee;
}
.a::before {
content: "♥";
color: red;
}
.a::after {
content: "♥";
color: blue;
}
/*html代码*/
<div class="a">
"hello"
</div>
文章来源：https://www.toymoban.com/news/detail-608383.html
从上面我们可以知道before与after是一个行内元素，我们可以添加属性display：block；来进行转换为块级元素。文章来源地址https://www.toymoban.com/news/detail-608383.html
到了这里，关于css中的before与after的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
