html>
<html>
<head>
<meta charset="utf8" http-equiv="content-type" content="text/css">
<title>dsaftitle>
<style>
p{
color: red;
}
div p{
font-size: 55px;
color: pink;
}
style>
head>
<body>
<p>这是p标签p>
body>
html>
请问:
1.为什么结果是红色字体而且不是55px,根据优先级p的优先级是1,div p的优先级是2,为什么会执行p{}而不是div p{}?
2.看结果好像直接连div p{}都没有执行,因为字号不是55px,这是为什么,定义了一个单独的p,又定义了一个继承了div的p,他们也只是颜色冲突,而字号并不冲突呀?
3.最后我想问一下这个div p{}和p{}有什么区别?都是用户样式么(用户自己定义的单独p{}和单独的继承后的p{})?
该回答引用chatgpt:
在该代码中,只有一个p标签,没有div标签,所以div p{}样式规则不会被应用。因此,只会应用p{}的样式规则。
样式表中的字号单位为px,而不是pt。这可能导致字号看起来比预期的小。另外,如果您的浏览器在调整文本大小时使用了缩放比例,也可能导致文本大小与预期不符。定义单独的p和继承自div的p的样式规则中,字号属性并没有冲突,但是字号大小由于单位的不同和缩放比例的影响,可能会显示不同的大小。
div p{}和p{}都是CSS选择器。p{}是匹配所有p标签的选择器,而div p{}是匹配所有在div元素内部的p标签的选择器。两个选择器的区别在于它们匹配的元素不同。这两个选择器都可以由用户定义,都是用户样式。
你的代码里没有 div,div p{}和p{},一个表示 div下的 p, 一个 是 所有p