防止子元素中的bootstrap冲突

时间:2016-09-29 14:44:18

标签: css twitter-bootstrap twitter-bootstrap-3

我在大部分页面都使用bootstrap,但是我想在div.col中使用自定义css来获得更好看的表,但是bootstrap css会影响某些样式。

我想重置特定div的所有样式,它是孩子们。

除了显式重载每个样式引导程序使用之外,还有其他方法可以处理吗?

2 个答案:

答案 0 :(得分:1)

要重置特定div的所有样式,可以添加'all:unset;' CSS属性。

<div style="all: unset;">...</div>

这将撤消(“取消设置”)当前应用于该div的所有样式(但不是它的子项),让您添加所需的任何样式。

在此处查看此操作(包括如何应用于所有子元素):

http://codepen.io/esr360/pen/kkogwm?editors=1100#0

这是一款“没有风格”的自举手风琴。

在此处查看浏览器支持:http://caniuse.com/#feat=css-unset-value

不出所料,这在IE中不起作用。

答案 1 :(得分:0)

在你希望有新风格的div中添加一个类,例如:class =&#34; new-style&#34;然后给他们提供bootstrap类,在下一步中为你的类定义属性和值并添加!important添加它们的结尾以从这个类中读取并覆盖到这个特殊div的bootstrap类。你没有做过重置bootstrap风格..... 您可以使用&#34;&#34;&#34;!important&#34;&#34;

解决您的问题