26

For example:

<select> <option value="one">1</option> <option value="two">2</option> <option value="three">3</option> </select>

I want to select the option where value = one, but I must select using the value attribute.

I've tried a few variations as the ones below:

option[value="one"]{ } select[value="one"]{ } select option[value="one"]{ }
Improve this question
1
  • 2
    The first and third selectors work fine. Commented Jul 24, 2015 at 20:18

1 Answer 1

Reset to default
33 

option[value=two] { background-color: yellow; }
<select> <option value="one">1</option> <option value="two">2</option> <option value="three">3</option> </select>

Improve this answer
Sign up to request clarification or add additional context in comments.

6 Comments

Works fine with the quotes too.
Yeah it looks like it works with or without quotes. For some reason it was not working before, but it is now.
Quotes should be used for string values. Only certain values work without them (namely, "identifier tokens", like a language identifier). See drafts.csswg.org/selectors-4/#attribute-selectors
Is it possible to keep the yellow background even when two is selected? So the select box is yellow?
doesn't work in chrome latest either (as for 2023)
|