在 CSS 中指定多个属性选择器 [英] Specify multiple attribute selectors in CSS

问题描述

执行以下操作的语法是什么:

input[name="Sex" AND value="M"]

基本上，我想选择具有属性 name="Sex" 以及属性 value="M"input 元素代码>:

不应选择以下元素:

解决方案

Simple input[name=Sex][value=M] 会很好.它实际上在标准文档中有很好的描述:><块引用>

多个属性选择器可以用来引用多个一个元素的属性，甚至是同一个属性的多次.

这里，选择器匹配所有具有hello"属性的 SPAN 元素恰好具有值克利夫兰"并且其再见"属性具有正是值哥伦布":

span[hello="Cleveland"][goodbye="Columbus"] { color: blue;}

作为旁注，仅当该值不是有效标识符时才需要在属性值周围使用引号.

JSFiddle 演示

What is the syntax for doing something like:

input[name="Sex" AND value="M"]

Basically, I want to select the input element that has the attribute name="Sex" as well as the attribute value="M":

<input type="radio" name="Sex" value="M" />

Elements such as the following should not be selected:

<input type="radio" name="Sex" value="F" />

解决方案

Simple input[name=Sex][value=M] would do pretty nice. And it's actually well-described in the standard doc:

Multiple attribute selectors can be used to refer to several attributes of an element, or even several times to the same attribute.

Here, the selector matches all SPAN elements whose "hello" attribute has exactly the value "Cleveland" and whose "goodbye" attribute has exactly the value "Columbus":

span[hello="Cleveland"][goodbye="Columbus"] { color: blue; }

As a side note, using quotation marks around an attribute value is required only if this value is not a valid identifier.

JSFiddle Demo

这篇关于在 CSS 中指定多个属性选择器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！