css - 複数の値の 1 つに正確に一致する CSS セレクターを指定するにはどうすればよいですか?

Question

フォームに複数の入力要素があります。「テキスト」または「電子メール」のいずれかの値を持つ属性「タイプ」を持つすべての入力要素に対して単一の css セレクターを指定したいと思います。単一のセレクターを指定するにはどうすればよいですか?

例えば

#ABC.XYZ .MNQ input[type="text"] {
margin-bottom: 8px;
}

最後にコンマを置き、type="email" でセレクター全体を繰り返すことができることを知っています。特別な演算子で同じことを行う短い形式があるかどうか疑問に思っていますか?

Answer 1

最も簡単な方法は次のとおりです。

#ABC.XYZ .MNQ input[type="text"] , #ABC.XYZ .MNQ input[type="email"] {
margin-bottom: 8px;
}

選択ラインを短くすると見栄えがします。しかし、全体的なコード実行効率については、違いはありません。