Question

我想设置“电子邮件”和“密码”类型的表单输入，但不是其他任何内容。我想象的是以下内容：

input[type="email"][type="password"] {
    ....
}

但是，属性选择器的工作方式，似乎将其解释为“输入，其中类型同时是'email'和'password'”。我想要的是“输入类型正好'电子邮件'或'密码'”。当然，同时没有任何类型的电子邮件和密码类型。

是否可以在多个不同的属性选择器中编写或的CSS规则？

作为参考，HTML看起来像：

<form id="login" onsubmit="return fadeaway()">
    <fieldset>
    <input type="email" placeholder="username"/> <br />
    <input type="password" placeholder="password"/> <br />
    </fieldset>
</form>

Answer 1

这样做：

input[type="email"], input[type="password"]

Answer 2

使用逗号：

input[type="email"],input[type="password"] {
    ....
}

w3 docs on group selectors here

CSS：多个属性选择器

2 个答案: