Określ wiele selektorów atrybutów w CSS

Jaka jest składnia robienia czegoś takiego:

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

W zasadzie chcę wybrać input element, który ma atrybut name="Sex" oraz atrybut value="M":

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

Należy wybrać elementy takie jak: , a nie:

<input type="radio" name="Sex" value="F" />
Author: DavidRR, 2012-09-09

5 answers

Proste input[name=Sex][value=M] byłoby całkiem nieźle. I to jest właściwie dobrze opisane w standard doc :

Wiele selektorów atrybutów może być używanych do odwoływania się do kilku atrybutów elementu, a nawet kilkukrotnie do tego samego atrybutu.

Tutaj selektor dopasowuje wszystkie elementy SPAN, których atrybut "hello" ma dokładnie wartość "Cleveland" i którego atrybut "goodbye" ma dokładnie wartość "Columbus":

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

Jako strona Uwaga, użycie cudzysłowów wokół wartości atrybutu jest wymagane tylko wtedy, gdy ta wartość nie jest prawidłowym identyfikatorem.

Jsfiddle Demo

 479
Author: raina77ow,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2018-02-02 14:42:55

Dla konkatenacji to:

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

A za wzięcie Unii to:

input[name="Sex"], input[value="M"] {}
 77
Author: Yogesh Khater,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2016-11-27 13:28:11

Połącz selektory atrybutów:

input[name="Sex"][value="M"]
 32
Author: Dennis,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2012-09-09 16:22:20

Dodam tylko, że nie powinno być miejsca między selektorem a nawiasem otwierającym.

td[someclass] 
Zadziała. Ale
td [someclass] 
Nie będzie.
 4
Author: Jean-Philippe Martin,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-08-10 20:22:34
[class*="test"],[class="second"] {
background: #ffff00;
}
 -7
Author: Eli,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-06-21 05:27:19