<svg xmlns="http://www.w3.org/2000/svg" style="display: none;"> <path stroke-linecap="round" d="M5,0 0,2.5 5,5z" id="raphael-marker-block" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);"></path> </svg> <blockquote> 讯享网
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档
最近使用了css的伪元素选择器和伪类选择器，感觉它们很相似，但是又有本质的区别。网上查了一些资料，解释得很详细，很专业。现在记录一下自己比较通俗理解。
伪元素的定义：CSS伪元素是用来添加一些选择器的特殊效果。
通过使用这两种选择器，我发现它们作用的对象是不同的。
1、伪元素选择器作用的对象是元素本身，无论元素是否包含子元素
列举两个例子：
1、改变元素内首字母的颜色
讯享网
效果如下：
改变元素内首字母的颜色时，元素是否有子元素，并不影响效果，也就是说，伪元素选择器作用于元素本身内容，而元素的子元素被忽略了，或者说被看作是元素的内容了。
2、添加一个子元素
讯享网
效果如下：
动态添加一个子元素时（位置：第一）。元素选择器作用于元素本身。
2、伪类选择器作用的对象是元素本身或者其的子元素
讯享网
效果如下：
鼠标悬停改变颜色时，:hover前不加空格，它作用于元素本身，:hover前加空格，它作用于元素子元素。
1.伪元素选择器是虚的
伪元素选择器虚的当它添加子元素时，新建了一个元素，但是这个元素并不存在于dom树中。这点检查代码时可以清楚的看到。
2.伪类选择器是实的
伪类选择器并不会创建元素，它只是修改元素的样式。
我对伪元素选择器和伪类选择器的理解。是通过查阅资料再结合自己使用这两种选择器以后总结的。只是自己对这两种选择器一点浅薄、实用、通俗的理解，仅供参考。如果有错误、片面的地方，还请大家多指教。
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请联系我们，一经查实，本站将立刻删除。
如需转载请保留出处：https://51itzy.com/kjqy/151950.html