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" />
Example# When you group CSS selectors, you apply the same styles to several different elements without repeating the styles in your style sheet. Use a comma to separate multiple grouped selectors. So the blue color applies to all <div> elements and all <p> elements.
The grouping selector selects all the HTML elements with the same style definitions. It will be better to group the selectors, to minimize the code. To group selectors, separate each selector with a comma.
CSS allows you to group multiple selectors that share the same declaration. This optimization technique allows you to apply the same style to multiple elements to save space. You can combine grouped selectors with contextual and other selectors to create powerful yet compact rules for your style sheets.
A CSS selector can contain more than one simple selector. Between the simple selectors, we can include a combinator. There are four different combinators in CSS: descendant selector (space)
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
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With