我该如何用css显示选择标题

Question

你好伙计们请帮助我这个我没有如何显示选择标题。我想在上面展示什么时候应该给你打电话？

请检查我的代码谢谢： -

 <select name="myfirst" title="When should we call you?">
    <option class="optnoval"></option>
    <option value="today" id="df">today</option>
    <option value="tommorow" id="df">tommorow</option>
    <option value="sunday" id="dfd">sunday</option>
 </select>

请检查在线codepen代码链接： - https://codepen.io/anon/pen/EQBbyG

Answer 1

如果你使用jQuery，你可以选择所有带有<select>属性的title元素，并将其值复制到第一个<option>中。

$("select[title] option:first-child").text(function(i, oldtext) {
  if (oldtext.trim() == '') {
    return $(this).parent().attr("title");
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="myfirst" title="When should we call you?">
    <option class="optnoval"></option>
    <option value="today">today</option>
    <option value="tommorow">tommorow</option>
    <option value="sunday" >sunday</option>
</select>
<select name="mytime" title="What time of day?">
    <option class="optnoval"></option>
    <option value="morning">Morning</option>
    <option value="afternoon" >Afternoon</option>
    <option value="evening">Evening</option>
</select>

Answer 2

您可以在HTML标记中添加<label>。

<label for="myfirst">When should we call you?</label>
<select name="myfirst" id="myfirst" title="When should we call you?">
	<option class="optnoval"></option>
	<option value="today" id="df">today</option>
	<option value="tommorow" id="df">tommorow</option>
	<option value="sunday" id="dfd">sunday</option>
</select>