CSS 禁用一个元素的引导程序
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/19414777/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Disable bootstrap for one element
提问by Lucas
What I want to achieve is to disable the Twitter Bootstrap class for my own input element with class named login_button
. By default the bootstrap.min.css
class is adding unnecessary properties like box-shadow
etc. to my input.login_button
element.
我想要实现的是为我自己的输入元素禁用 Twitter Bootstrap 类,该类名为login_button
. 默认情况下,bootstrap.min.css
该类box-shadow
向我的input.login_button
元素添加了不必要的属性,例如等。
I know I can define box-shadow: none;
but I wonder if there are other possibilities to achieve that?
我知道我可以定义,box-shadow: none;
但我想知道是否还有其他可能性来实现这一目标?
采纳答案by James Donnelly
Just override the Bootstrap style. As long as Bootstrap is included on your page before your custom CSS then your CSS should override Bootstrap as the specificity of the selector would be the same. Add this to your custom CSS and override the styles accordingly:
只需覆盖 Bootstrap 样式。只要 Bootstrap 包含在您的自定义 CSS 之前的页面中,那么您的 CSS 就应该覆盖 Bootstrap,因为选择器的特异性是相同的。将此添加到您的自定义 CSS 并相应地覆盖样式:
input.login_button {
box-shadow: none;
border: none;
line-height: initial;
/* Etc. */
}
Here input.login_button
has a specificityscore of 011
whereas Bootstrap's input[type="text"]
only has a specificity score of 010
, meaning your custom style will be strong enough to override Bootstrap's regardless of the order of your CSS.
这里input.login_button
的特异性得分为 ,011
而 Bootstrap 的input[type="text"]
特异性得分仅为010
,这意味着无论 CSS 的顺序如何,您的自定义样式都将足够强大以覆盖 Bootstrap。
回答by meagar
You can't, except by modifying bootstrap.min.css. All you can do is overwrite the styles with more specific selectors.
你不能,除非通过修改 bootstrap.min.css。您所能做的就是使用更具体的选择器覆盖样式。