如何从 f.label 中删除粗体答案

【问题标题】：How to remove Bold from f.label如何从 f.label 中删除粗体
【发布时间】：2013-12-06 07:32:02
【问题描述】：

我正在设计一个在 Rails 上开发的网页。

所以，我有一个带有密码复选框的表单。问题是它总是加粗，我不能改变它。我已成功将字体样式更改为斜体，颜色，但我无法删除设置为默认设置的粗体（我猜）。

在我的代码下面：

        <% if devise_mapping.rememberable? -%>
            <div class="remember_forgot_top remember_me_position"><%= f.check_box :remember_me %> <%= f.label :remember_me %></div>
        <% end -%>

有人知道如何去除粗体以及如何对标签进行风格化吗？

PS：我正在使用 twitter 引导程序。

【问题讨论】：

用你的开发工具检查label，看看它是从哪里得到bold风格的。也尝试像label{font-weight:normal !important;} 一样覆盖它。
没有看到任何合理的地方来自该粗体。按照您的建议覆盖标签也不起作用。 :(
你能发一个jsfiddle吗？
jsfiddle.net/q8ZgL

标签： css ruby-on-rails-4 twitter-bootstrap-3

【解决方案1】：

引导 v4.4.1

当我想用 JS/DOM 设置 font-weight 再次时，接受的答案将是问题。

如果你注意到 debug css，你会看到：

label:not(.form-check-label):not(.custom-file-label) {
    font-weight: 700;
}

所以，在你的标签中添加一个“form-check-label”类，它不会是粗体的。

【讨论】：

【解决方案2】：

由于我有时只需要非粗体标签文本，因此我通过在标签助手中使用 css 类来解决它：

<%= label :model, :fieldname, class: "not-bold" %>

在样式表中：

.not-bold {font-weight:normal !important;}

【讨论】：

或者只是做<div style="font-weight:normal !important;">text here</div>

【解决方案3】：

这个问题有点老了，但我自己只是在将旧的 3.x 引导站点更新到 4.x 时偶然发现了这个问题； bootstrap.min.css 将标签样式设置为 700 字体粗细。它似乎不存在于 bootstrap 4.x 中；在调用引导程序后用 !important 覆盖标签 css，就像在该元素的 css 上使用更高程度的特异性（标识符、多个类等）一样。我的问题是通过撤消此操作来解决的，或者将粗体样式重新放在这些在我们的升级中失去粗体的标签上。

【讨论】：

【解决方案4】：

我解决了这个覆盖标签的问题

label {
    font-weight: normal !important;
}

感谢@vucko，他给了我帮助。

【讨论】：

我可以在没有!important 的情况下修复它。我把这段代码放在@import "bootstrap";之后。
正如@Powers 所暗示的——如果你不需要，请避免使用!important！在另一种情况下，其他人会想要一个粗体标签，而您将发起 !important 战争。爱，而不是战争。
当我想用 JS/DOM 再次设置字体粗细时，接受的答案将是问题。