覆盖 CSS 中的属性
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/6295321/
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
Overriding properties in CSS
提问by de3
#iddiv span {
display: inline-block;
width: 190px;
}
.myclass {
width:10px;
}
Then I have
然后我有
<div id="iddiv">
<span>hello:</span>
<span class="myclass">yeah</span> <br/>
</div>
I would like the first span
's width
to be 190px, and second's to be 10px. But both are 190px: why it's not overriding the width
propoerty?
我想第一span
的width
是190px,和第二的是10px的。但两者都是 190px:为什么它不覆盖width
属性?
EDIT: Thanks for your responses. What about unsetting width? I don't want 10px width, just default width as if it was undefined
编辑:感谢您的回复。取消设置宽度怎么样?我不想要 10px 宽度,只是默认宽度,好像它是未定义的
采纳答案by RwwL
回答by Eric
You could always use the !important
flag to override:
您始终可以使用该!important
标志来覆盖:
.myclass {
width: 10px !important;
}
回答by JohnP
CSS applies styles according to the specificity of the selectors
CSS 根据选择器的特殊性应用样式
#iddiv span
is more specific than myclass
. Changing it to #iddiv .myclass
should fix the issue for you.
#iddiv span
比 更具体myclass
。将其更改为#iddiv .myclass
应该可以为您解决问题。
Here's an article that goes more in depth about this : http://htmldog.com/guides/cssadvanced/specificity/
这是一篇更深入的文章:http: //htmldog.com/guides/cssadvanced/specificity/
回答by Jason Gennaro
It's not working because the first style is more specific.
它不起作用,因为第一种样式更具体。
To fix it, make sure you target the second span
more directly, like this
要修复它,请确保您span
更直接地瞄准第二个,就像这样
#iddiv span.myclass
#iddiv span.myclass
回答by Kon
First of all, I'd suggest you properly target your selectors, as others are suggesting.
首先,我建议您像其他人建议的那样正确定位您的选择器。
But when all else fails, you can use !important.
但是当所有其他方法都失败时,您可以使用!important。
回答by woodykiddy
Remember to use the keyword, !important, which functions to overwrite parent rules.
请记住使用关键字 !important,它的作用是覆盖父规则。
Also you can define your "myclass" in the following way:
您也可以通过以下方式定义“myclass”:
#iddiv span.myclass {
width:10px;
}