css:before和:after
2020/11/9 8:51:07 阅读：6070
发布者：6070
:before是css中的一种伪元素，可用于在某个元素之前插入某些内容。
:after是css中的一种伪元素，可用于在某个元素之后插入某些内容。
<style>
p:before{
content: "H" /*:before和:after必带技能，重要性为满5颗星*/
}
p:after{
content: "d" /*:before和:after必带技能，重要性为满5颗星*/
}
</style>
<p>ello Worl</p>
以上的代码将会在页面中展现的是"Hello World"
p标签内部的内容的前面会被插入一个:before伪元素，该伪元素内包含的内容是"H"；而在p标签内的内容后面会被插入一个:after伪元素，该元素包含的内容是"d"。
清除浮动 场景:当一个元素在众多设置了浮动样式float: left的后面，但是又要另起一行时;建议:强烈推荐;代码:.container::before { content: ""; display: table; } .container::after { clear: both; }
利用::before ::after伪类，动态的在元素开始和末尾增加标签这一特性，我们可以做出很多丰富的样式而且又减少了 DOM 的复杂度。
【 微信扫一扫 】
