如何在一个 css 选择器中访问两个 Id
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/9902305/
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
How to access two Ids in one css selector
提问by Basit
I have div which has three buttons as,
我有一个 div,它有三个按钮,
<div id="buttons">
<input id="preview" class="ButtonStyle" type="submit" value="Preview" name="preview">
<input id="add" class="ButtonStyle" type="submit" value="Save" name="add">
<input id="Cancel" class="ButtonStyle" type="submit" value="Cancel" name="Cancel">
</div>
I set its style. I want that both add and cancel button have their left-margin: 5px; Right now I am doing it in this manner,
我设置了它的风格。我希望添加和取消按钮的左边距为:5px;现在我就是这样做的,
#outboxmidpg #buttons input[type="submit"]{
font-weight: bold;
width: 70px;
}
#outboxmidpg #buttons input[id="Cancel"] {
margin-left: 5px;
}
#outboxmidpg #buttons input[id="add"] {
margin-left: 5px;
}
I want to do it in one line. I tried this, but it didn't work and it removes the cancel button margin too.
我想在一行中完成。我试过这个,但它没有用,它也删除了取消按钮的边距。
#outboxmidpg #buttons input[id="Cancel"] input[id="add"] {
margin-left: 5px;
}
Is there anyway that I can achieve the style in one line?
无论如何,我可以在一行中实现这种风格吗?
Thanks
谢谢
回答by mas-designs
#buttons input:nth-child(2), #buttons input:nth-child(3){
margin-left:5px;
}
does this work for you ?
这对你有用吗?
or simply:
或者干脆:
#Cancel, #add{
margin-left:5px;
}
With ,
seperation you start a complete new CSS Selector and combine them.
通过,
分离,您可以启动一个全新的 CSS 选择器并将它们组合起来。
回答by spongecode
Best practice to do is: Just put all the id's/class and separate them by commas (,) then insert your custom style on its body.
最佳做法是:只需放置所有 id/class 并用逗号 (,) 分隔它们,然后在其主体上插入您的自定义样式。
#Button_One, #Button_Two {
vertical-align: middle;
padding-top: 10px;
margin-top: 1px;
}
Hope it helps :)
希望能帮助到你 :)
回答by PraveenVenu
try this
尝试这个
#outboxmidpg #buttons input[id="Cancel"], #outboxmidpg #buttons input[id="add"] {
margin-left: 5px;
}
回答by Andreas Wong
You need to separate selector by comma (,) in their respective full qualified paths, otherwise it won't work:
您需要在各自的完全限定路径中用逗号 (,) 分隔选择器,否则将无法工作:
#outboxmidpg #buttons input[id="Cancel"],
#outboxmidpg #buttons input[id="add"] {
margin-left: 5px;
}
回答by professorsloth
You can do it in one line, but it will be two selectors. Try this:
您可以在一行中完成,但它将是两个选择器。尝试这个:
#outboxmidpg #buttons input#Cancel, #outboxmidpg #buttons input#add {
margin-left: 5px;
}
Also, try to use #
when selecting id's, it's the proper way to select them.
另外,#
在选择 id 时尝试使用,这是选择它们的正确方法。