一、选不中说
https://web.qianguyihao.com/02-CSS%E5%9F%BA%E7%A1%80/05-CSS%E6%A0%B7%E5%BC%8F%E8%A1%A8%E7%9A%84%E7%BB%A7%E6%89%BF%E6%80%A7%E5%92%8C%E5%B1%82%E5%8F%A0%E6%80%A7.html#%E9%A2%98%E7%9B%AE%E6%BC%94%E7%A4%BA
二、优先级说
根据提供的图片和注释,我们可以分析出 <p>
标签中的文字颜色。
CSS 选择器优先级
-
div p
:- 这个选择器是一个组合选择器,包含一个元素选择器
div
和一个元素选择器p
。 - 元素选择器的权重是 1,因此总权重是 1 + 1 = 2。
- 这个选择器会选择所有在
div
元素内的p
元素,并将它们的颜色设为红色。
- 这个选择器是一个组合选择器,包含一个元素选择器
-
#box
:- 这个选择器是一个 ID 选择器。
- ID 选择器的权重是 100。
- 这个选择器会选择 ID 为
box
的元素,并将它的颜色设为蓝色。
HTML 结构
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Multiple Backgrounds Example</title>
<style>
div p {
color: red;
}
#box {
color: blue;
}
</style>
</head>
<body>
<div id="box">
<p id="para" class="spec">
<span>文字</span>
</p>
</div>
</body>
</html>
选择器优先级比较
div p
的权重是 2。#box
的权重是 100。
结果
根据选择器的优先级,#box
选择器的权重(100)高于 div p
选择器的权重(2)。因此,#box
选择器的样式将会覆盖 div p
选择器的样式。
结论
在你的 HTML 结构中,<p>
标签中的文字颜色将是蓝色,因为 #box
选择器的优先级更高。、