代码之家 › 专栏 › 技术社区 › Anurag

将两个或多个CSS选择器与布尔条件组合在一起

css-selectors css

Anurag · 技术社区 · 15 年前

有没有一种方法可以使用布尔条件组合两个或多个CSS选择器- and , or , not ?

考虑这个 <div> :

<div class="message error">
    You have being logged out due too much activity.
</div>

例如,我可以只选择那些包含这两个类的元素吗?

有点像 div.message && div.error 是吗?

2 回复 | 直到 10 年前

Brenton Alker 15 年前

这些应该有效:

&& = div.message.error {}
|| = div.message, div.error {}

别以为你能做到“不”

编辑:刚刚做了一个快速测试以确认:

<html>
    <head>
        <style type="text/css">
            div.error.message {
                background-color: red;
            }
            div.message, div.error {
                border: 1px solid green;
            }
        </style>
    </head>
    <body>
        <div>None</div>
        <div class="error">Error</div>
        <div class="message">Message</div>
        <div class="error message">Error Message</div>
    </body>
</html>

“message”、“error”和“error message”分区都有绿色边框,只有“error message”分区有红色背景。