伪元素和伪类
什么是伪元素？
CSS 在渲染文档的时候，伪元素可以通过 css 给 HTML 添加一个元素（叫标签也行），这个元素在文档树中是找不到的。伪元素被当做 CSS 的样式来进行展现，用法和普通的元素用法是一样的。
伪元素和伪类
伪元素和伪类的写法有点像，伪元素使用 2 个冒号，常见的有：::before，::after，::first-line，::first-letter，::selection、::placeholder 等；
伪类使用 1 个冒号，常见的有：:hover，:link，:active，:target，:not()，:focus 等。
伪元素和伪类的区别
伪元素添加了一个页面中没有的元素（只是从视觉效果上添加了，不是在文档树中添加），伪类是给页面中已经存在的元素添加一个类。
CSS2 中的伪元素使用 1 个冒号，在 CSS3 中，为了区分伪类和伪元素，规定伪元素使用 2 个冒号。
伪元素::before ::after
-
::before 和::after 在被选中元素里面、元素现有内容之前（后）插入内容，需要使用 content 属性指定要插入的内容。content 必须有值（空值也行）
-
content 插入的内容默认是 inline 元素，可以通过 display:block 改变。
所以当选中的元素没有内容的时候 ::before 和::after 插入的位置是一样的
网友评论