＜p＞标签中的文字颜色

小句

已于 2024-07-14 01:00:53 修改

阅读量285

点赞数 4

分类专栏： css 文章标签： html

于 2024-07-14 00:59:35 首次发布

本文链接：https://blog.csdn.net/flamesfather/article/details/140409362

版权

css 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

一、选不中说

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>