老师请帮我看一下，显示效果不太对
来源：2-45 伪元素after（二）
愛码仕
2020-05-07 01:52:17
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
p:before{content:"我是后加的";}
div:first-child{color: red;}
</style>
</head>
<body>
<p>
<div>我是div</div>
</p>
</body>
</html>
我写的又那里不对吗？为什么在浏览器中出现了两个：：before
而且我还有个问题。我当时写这个是想测试一下，添加了伪元素以后，如果我用div：first-child{color:red}来改变<p>标签下的第一个元素的字体样式的话，那么伪元素：：before会被算成是第一个元素吗？测试结果伪元素：before的字体颜色没有改变。所以我的测试结果是正确的吗？添加了伪元素以后，再用伪类的话，伪元素是不算在内的吗？
写回答
1回答
-
同学你好，解答如下：
（1）因为p标签嵌套div标签是不规范的，所以浏览器无法正确解析。解析结果如下：
所以出现了2个p标签，2个伪类。
（2）不是的，伪元素不算的。也是因为标签嵌套不规范，导致浏览器呈现的标签嵌套与同学书写的不一样，如上图。div并不是p标签中的子标签，所以样式没有生效。可以修改标签试一下：
效果：
如果我的回答帮到了你，欢迎采纳，祝学习愉快~
0
相似问题