覆盖引导样式不起作用

Posted

技术标签:

【中文标题】覆盖引导样式不起作用【英文标题】:Override bootstrap style not working 【发布时间】:2016-12-22 02:19:33 【问题描述】:

我有这种简单的情况,我有一个没有定义 display 属性值的样式,我最近在我的项目中添加了引导程序,没有大问题,只有一个。

label 引导样式中定义了一个 display: inline-block; 我不需要并且在我的页面上导致了一些故障排除。所以简单地我覆盖了它,但它似乎正在获得引导值。 !important 也不起作用。如下图所示:

甚至,它在开发者工具上被标记为已覆盖。我还测试了从引导文件中删除该行并且它可以工作,但在我的情况下这不是可行的选择。 正如我所说,我被困在这里,没有更多的引导问题,并且以前没有遇到过这种情况。

我必须补充一点,我正在为页面上的样式表设置正确的位置。

编辑:

当我删除引导样式时,我将附上结果和预期结果。即使它被覆盖,它似乎也能正常工作。

移除引导样式时的预期结果(这适用于及时开发者工具以及从 bootstrap.css 中移除时)

PS:IE浏览器按需选择。

EDIT2:

问题解决了,和IE版本有关,我们公司只在这个应用程序上支持IE,问题是之前的一些变化迫使IE在版本5上运行兼容,因为任何人都知道的原因,切换到IE 作为标准,它正在发挥作用。

感谢大家的任何想法或评论。

【问题讨论】:

你是在自己的css之前还是之后导入bootstrap.css? @singebatteur 之前,我的 css 是页面中的最后一个导入。 你必须在你的 bootstrap.css 之后调用你的 style.css,否则它不会覆盖任何东西 @singebatteur 它是在引导之后,我的意思是,这很奇怪,因为我覆盖了几种样式并且只有这个有问题,而且...对象没有其他选择器,只有它的 ID 和标签 html 标签。 你试过现代浏览器吗? 【参考方案1】:

问题与 IE 兼容模式有关。

【讨论】:

【参考方案2】:

这对我有用: 我的问题是我链接它的方式。

示例:假设 input 标记从供应商文件(例如引导程序)继承样式,并说您在项目中太远了,并且以相反的方式链接文件会破坏您的布局,然后创建一个新的样式表并链接它在引导链接之后。

<link rel="stylesheet" href="styleSheet.css"> <link rel="stylesheet" href="bootstrapStyles.css"> <link rel="stylesheet" href="newStyleSheet.css">//为您不希望从引导程序中继承样式的元素编写样式并以这种方式链接。

正确的做法:<link rel="stylesheet" href="bootstrapStyles.css"> <link rel="stylesheet" href="styleSheet.css">

【讨论】:

以上是关于覆盖引导样式不起作用的主要内容,如果未能解决你的问题,请参考以下文章

覆盖 JQXWidget css 样式不起作用

使用样式化组件覆盖 antd Button 的样式不起作用?

覆盖 Material-UI 样式不起作用

覆盖和重置 CSS 样式:auto 或 none 不起作用

引导媒体查询在 576 像素时不起作用

引导类“文本中心”不起作用