时间戳

首页 > 解决方案 > 我的类选择器被元素选择器覆盖

html - 我的类选择器被元素选择器覆盖

问题描述

我目前正在为我的 uni 课程做一个项目，但我的 html+css 代码的以下部分有问题：

h1, h2, h3 {
  color: #747d19;
}
.name_date {
  color: #861781;
}
<div class="name_date">
  <h3>Shean</h3>           
  <p><i><b>August 3rd, 2018</b></i></p>
</div>

我理解它的方式是，类选择器更具体，因此会覆盖元素选择器。但是在查看结果时，文本“Shean”是使用 h3 颜色规则格式化的。我究竟做错了什么？

标签： htmlcss

解决方案

当类选择器位于 h3 标记中时，这是正确的。

h3{
  color: red
}
.purpleHeader{
  color: purple
}

<h3 class="purpleHeader">La la la la...</h3>

为了实现您的目标，您必须编写更具体的规则。

.purpleHeader h3 {
  color: red
}
.purpleHeader {
  color: purple
}

现在是红色的

推荐阅读