需要向包含“保存”按钮的 <p> 添加一些 CSS，选择器会是啥样子？ [复制]

Posted 2023-03-06

【中文标题】需要向包含“保存”按钮的 <p> 添加一些 CSS，选择器会是啥样子？ [复制]

【英文标题】：Need to add some CSS to a <p> that contains "Save" buttons, What would the selector look like? [duplicate]需要向包含“保存”按钮的 <p> 添加一些 CSS，选择器会是什么样子？ [复制]

【发布时间】：2013-12-18 21:12:01

【问题描述】：

我有一些 html：

<p>
        <button type="submit" name="btn" value="Save">Save</button>
        <button type="submit" name="btn" value="Cancel">Cancel</button>
</p>

我想创建一个 CSS 选择器来匹配包含上述按钮的所有“p”标签，以便我可以添加：

padding-top:20px;

给它。

看看是否可以将此样式添加到另一个父级，例如“div”，这也很有趣。

我猜一个人会做这样的事情：

p button, div button 

以上将样式应用于按钮标签，而我希望将其添加到“div”或“p”标签。

想法？？

非常感谢。

【问题讨论】：

在<p>上放一个类，按类选择，然后继续

不能在css中根据子元素进行选择，需要使用javascript/jQuery。

如果你想用 jQuery 做到这一点.. $('p:has(button[value="Save"])').css("background","red"); jsFiddle example

感谢您的所有 cmets。非常有帮助。不知道它不能作为标准来完成，但是在 JQuery 中有一个解决方法。

【参考方案1】：

jQuery 答案：

$('p:has(button[value="Save"])').addClass('containsButtons');

【讨论】：

实际上我最后还是接受了 Class 建议，因为我想将它保留在 CSS 中，但还是谢谢你。