在前端开发中，有一个原则至关重要：结构与样式分离。我们希望 HTML 代码保持干净、语义化，而不被大量的装饰性 <div> 或 <span> 标签所污染。

这时候，CSS 伪元素 (Pseudo-elements) 就派上用场了。它们就像是隐藏在 CSS 中的「幽灵元素」，不仅能帮你保持 HTML 的整洁，还能创造出令人惊叹的视觉效果。

什么是伪元素

简单来说，伪元素允许你对被选择元素的特定部分进行样式设置，或者在元素内容的前后插入虚拟内容。