css - 如何在一个 css 选择器中访问两个 ID

Question

我有一个包含三个按钮的 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>

我设置它的风格。我希望添加和取消按钮都有它们的左边距: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;
}

我想在一行中完成。我试过了，但没有用，它也删除了取消按钮边距。

#outboxmidpg #buttons input[id="Cancel"] input[id="add"] {
    margin-left: 5px;
}

无论如何，我可以在一行中实现样式吗？

谢谢

Answer 1

#buttons input:nth-child(2), #buttons input:nth-child(3){
    margin-left:5px;
}

这对你有用吗？

或者简单地说:

#Cancel, #add{
    margin-left:5px;
}

使用 , 分隔，您可以启动一个全新的 CSS 选择器并将它们组合起来。