bootstrap阻塞jquery函数

Question

我需要使用jQuery中的slideDown函数，这需要将内容设置为动画放在类＆＃34; .hide＆＃34;，

for .hide我在我的自定义css中有这个：

.hide {
    display: none;
}

与Bootstrap css冲突，因为它包含：

.hide {
    display: none !important;
}

因此当我链接这两个样式表时，slideDown正在工作，然后我在两个文件中尝试了.hide的不同变体，最后从我的自定义css文件中删除.hide完全有效，

所以我的问题是为什么自定义css中的.hide会在Bootstrap＆＃34; .hide＆＃34;中定义属性时影响结果。和自定义css＆＃34; .hide＆＃34;是完全相同的，除了＆＃34; ！important＆＃34;另外哪个（我猜，请纠正，如果我错了）暗示自定义选择器会被优先考虑？

我正在尝试使用codepen分享我的代码的工作版本，但我不知道为什么我的代码仍在使用codepen：http://codepen.io/anon/pen/RaGJwE

Answer 1

!important总是非常强大。如果之后使用display: block !important;，则可以绕过它。

最简单的方法是不使用bootstrap所针对的“hide”或“hidden”类。只需将类更改为“hideit”或其他类似于此更新的小提琴： http://codepen.io/anon/pen/MyjXOv