我有一个选择框，我试图更改的选项的背景颜色时，选择框被单击并显示所有的选项。
html
- <select>
- <option val="">Please choose</option>
- <option val="1">Option 1</option>
- <option val="2">Option 2</option>
- <option val="3">Option 3</option>
- <option val="4">Option 4</option>
- </select>
css
- select{
- margin:40px;
- background: rgba(0,0.3);
- color:#fff;
- text-shadow:0 1px 0 rgba(0,0.4);
- }
解决方法
您需要在选项标记上放置background-color，而不是选择标记…
- select option {
- margin: 40px;
- background: rgba(0,0.3);
- color: #fff;
- text-shadow: 0 1px 0 rgba(0,0.4);
- }
- select option {
- margin: 40px;
- background: rgba(0,0.4);
- }
- select option[value="1"] { /* value not val */
- background: rgba(100,100,0.3);
- }
- select option[value="2"] { /* value not val */
- background: rgba(200,200,0.3);
- }
- /* ... */
