无法覆盖bootstrap css

Question

我试图覆盖在“模态脚”的bootstrap类中找到的以下内容

margin-top: 15px;

我有以下HTML代码执行此操作：

<div class="modal-footer my-modal-footer-override"></div>

以及以下自定义css：

.my-modal-footer-override {
    margin-top: 0px
}

但这不起作用。 有什么建议么 ？

Answer 1

您可以尝试更具体的选择器。 这可以解决问题

.modal-footer.my-modal-footer-override {
   margin-top: 0px;
}

多个类选择器应该比IE6更新。 请注意类之间没有空格：这意味着两个类都应用于同一个元素 。

如果这仍然没有削减它，你可以把.modal放在这个选择器之前，所以： .modal .modal-footer.my-modal-footer-override 。

important! 声明可以用作肮脏的黑客，但我会建议反对它。

Answer 2

检查您的CSS导入订单。 确保在Bootstrap之后加载自定义css。 使用firebug或chrome dev工具来查看您的样式是否被覆盖，因为html中稍后导入了某些内容。

Answer 3

你试过这个吗？

.my-modal-footer-override {
    margin-top: 0px !important;
}

在“;”之前使用！important 会给这个规则比bootstrap css更重要。

您可以使用..css ..在头部或新的css文档中添加HTML内部。