Question

我有以下课程，我在标签等多个地方使用

.cont-label.ope-label {
    font-weight: normal;
    text-align: left;
    font-family: ariel;
    font-size: 18px;

}

现在我想添加标题对于特定类别的颜色，有一种方法不这样做？

.cont-label.ope-label-new {
    font-weight: normal;
    text-align: left;
    font-family: ariel;
    font-size: 18px;
    color:red;

}

Answer 1

你可以给标题一个你想要的颜色类并覆盖它：

<h1 class="cont-label ope-label red">test</h1>

然后css：

.red {color:red;}

如果您的原始标题有颜色集，那么特异性将进入其中：

.cont-label.ope-label.red {color:red;}

Answer 2

如果您的意思是<header>元素，请使用

header .cont-label.ope-label {color: red;}

如果header应该只是class / id，请使用类似的

.header .cont-label.ope-label {color: red;}
/* or for ID */
#header .cont-label.ope-label {color: red;}

Answer 3

试试这样：

<强> HTML：

<header> 
<div class="cont-label ope-label">
... 
</div>
</header>

<强> CSS：

.cont-label.ope-label,header.cont-label.ope-label {
    font-weight: normal;
    text-align: left;
    font-family: arial;
    font-size: 18px;    
}

.cont-label.ope-label {
    color:blue;    
}

header.cont-label.ope-label {   
    color:red;    
}

Answer 4

您只需要创建一个像

这样的CSS层次结构

.header .cont-label.ope-label{
      color: red;
    }

只使用一个类而不是两个类

4 个答案: