Question

我有一个班级，我正在用它来制作一些文字海军和大号：

.sectiontext {
    color: navy !important;
    font-size: large;
}

我将它应用于这样的元素：

<label class="sectiontext">Select a Unit</label>
. . .
<h4 class="sectiontext">Specify Recipients</h4>

问题在于，当我将它应用于标签时，它会使该文本变为粗体。我尝试将以下行添加到sectiontext类：

font-weight: normal !important;

......但没有区别;我不想在某些文本中使用“h4”而不是“label”，因为h4总是包含“换行符”;我希望能够在“select”元素和几个复选框之前使用这种文本样式，因此没有文本“break”

但是即使在sectiontext类中添加了“！important”，文本仍然是粗体。例如，将“选择单位”和“选择报告[s]”标签与H4“指定收件人”和“生成和电子邮件报告”文本进行比较：

如果标签不是粗体，我该怎么做？

更新

我唯一的自定义CSS是：

body {
    padding-top: 50px;
    padding-bottom: 20px;
    background-color: lightyellow;
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}

.containerforplatypus {
    border: 2px solid #ccc;
    width: 100%;
    height: 100%;
    overflow: hidden;
    margin-bottom: 8px;
    padding: 6px;
}

.margin4horizontal {
    margin-left: 4px;
    margin-right: 4px;
}

.fancyorangetext {
    text-shadow: 0 0 6px orange !important;
    font-size: xx-large;
}

.leftmargin8 {
    margin-left: 8px !important;
}

.sectiontext {
    color: navy !important;
    font-size: large;
    font-weight: normal !important;
}

...否则，它只是正在使用的这些引导类：

jumbotron
row
col-md-6
col-md-12
control-label
form-control
h3
h4
btn btn-primary
btn btn-sm

这两个有问题的标签（在上下文中）的整个HTML是：

<div class="row">
    <div class="col-md-12" name="unitsCheckboxDiv">
        <label class="sectiontext">Select a Unit</label>
        <select class="form-control, dropdown">
            @foreach (var field in units)
            {
                <option id="selItem_@(field.unit)" value="@field.unit">@field.unit</option>
            }
        </select>
    </div>
</div>

<div class="row">
    <div class="col-md-12" name="unitsCheckboxDiv">
        <div class="containerforplatypus">
            <label class="sectiontext">Select Report[s]</label>
            @foreach (var rpt in reports)
            {
                <input class="leftmargin8" id="ckbx_@(rpt.report)" type="checkbox" value="@rpt.report" />@rpt.report
            }
        </div>
    </div>
</div>

更新2

它现在有效，没有变化;它首先尝试尝试fmz的建议，但后来我又尝试了我以前的方法，它现在有效，甚至没有“！important”标记：

.sectiontext {
    color: navy !important;
    font-size: large;
    /*font-weight: 400 !important; <= works */
    /*font-weight: normal !important; <= works now, as does the rule below */
    font-weight: normal;
}

Answer 1

考虑使用：

标签{font-weight：400！important}

同时指定字体大小，因为您的标签似乎显示的字体大小超过正常字体。

Answer 2

默认情况下，标签不是粗体。

尝试用以下内容覆盖它：

html label.sectiontext { font-weight: inherit; }

html和标签名称会给它一些优先权。如果继承不起作用，那么尝试“正常”。

Answer 3

您能否提供代码的工作示例？（jsfiddle等）

如果没有看到实际的代码示例，我会说h4设置会覆盖您的sectiontext课程设置，您需要添加h4 .sectiontext { font-weight: normal; }

如何使用css强制文本为“正常”（非粗体）？

更新

更新2

3 个答案: