Question

对于未选择“请选择”的情况，我想对因此，如果选项值为空->灰色选项值不为空->蓝色 Codepen： https://codepen.io/jossnaz/pen/dLxezv 我想要什么？这个：

Answer 1

HTML5的验证可以在这里帮助您。具体来说，您需要使select为必需。然后使用:valid伪类进行样式设置。

请记住，value=""（未定义）无效。任何字符串都是有效的，因此您可以利用它来发挥自己的优势。

这是一个例子：

select {
  font-size: 14px;
  color: #ccc;
  padding: 5px 10px;
}
select:focus {
  outline: 0 none;
}

select:valid {
  color: blue;
}

<select required>
<option value="">Empty value isn't valid</option>
<option value="1">Valid option</option>
<option value="2">Another valid option</option>
</select>

<select>选定元素的CSS选择器，除非为空

1 个答案: