在CSS中指定多个属性选择器

CSS

小胖

2020-03-24

做这样的事情的语法是什么:

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

基本上,我想选择input具有属性name="Sex"属性元素value="M"

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

元件如以下应该没有被选择:

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

第3150篇《在CSS中指定多个属性选择器》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

4个回答
老丝 2020.03.24

串联起来的是:

input[name="Sex"][value="M"] {}

参加工会是:

input[name="Sex"], input[value="M"] {}
LEY西门 2020.03.24

连接属性选择器:

input[name="Sex"][value="M"]
null 2020.03.24

简单input[name=Sex][value=M]会做的很好。它实际上在标准文档中有很好的描述

可以使用多个属性选择器来引用元素的多个属性,甚至可以多次引用同一属性。

在此,选择器匹配所有SPAN元素,这些元素的“ hello”属性的值恰好为“ Cleveland”,而其“再见”属性的值恰为“ Columbus”:

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

附带说明,仅当该值不是有效标识符时,才需要在属性值周围使用引号。

JSFiddle演示

Itachi 2020.03.24

只是要补充一点,选择器和开口支架之间应该没有空间。

td[someclass] 

将工作。

td [someclass] 

将不会。

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android