如何在不使用 !important 的情况下覆盖 element.style答案

【问题标题】：How to override element.style without using !important如何在不使用 !important 的情况下覆盖 element.style
【发布时间】：2016-05-23 07:05:07
【问题描述】：

我正在以角度形式使用引导弹出框，其中弹出框的顶部和左侧是自动计算的，即使在增加特异性后我也无法覆盖它， div.popover.right.in.fade (element .style ) 总是优先于我的 css ，

.form-name .alert-container .name-alert .popover{
left: 95%;
top: 150px;
}

我需要知道如何在不使用 !important 的情况下覆盖 element.style。

【问题讨论】：

设置为内联样式。
无论选择器的特性如何，都不能覆盖内联样式。在不使用 !important 的情况下，您可以尝试绕过它（例如，如果您需要，请使用不同的属性，如变换或边距来更改元素位置）。
没办法。不使用！important。无法覆盖 css 属性。相反，您可以使用像 document.getElementBy(''URELEMENTID").style.left="95%"; 这样的 javascript 重写 css 样式属性

标签： css angular-bootstrap

【解决方案1】：

应该首先加载 boostrap 样式表，然后是您的样式表，这样您的覆盖将被拾取。

这被称为“级联”，来自文档：

级联

这是一些样式表语言（例如 CSS）提供的功能，允许将来自多个来源的样式信息混合在一起。例如，这些可能是公司样式指南、一组文档共有的样式以及特定于单个文档的样式。通过单独存储这些样式表，可以重复使用样式表，从而简化创作并更有效地利用网络缓存。级联定义了样式表的有序序列，其中后面的表单中的规则比前面的规则具有更高的优先级。并非所有样式表语言都支持级联。

【讨论】：