如何在HTML中的选择(下拉)菜单中设置不可选择的默认描述？

Question

我有一个用户选择语言的下拉列表:

<select>
    <option>English</option>
    <option>Spanish</option>
</select>

1. 我希望最初显示的默认选项说"选择一种语言"而不是"英语"(我的第一个选项,默认显示).
2. 我不希望用户能够选择"选择语言".

Answer 1

基于Oded的答案,您还可以设置默认选项,但如果它只是虚拟文本,则不能使其成为可选选项.例如,您可以这样做:

<option selected="selected" disabled="disabled">Select a language</option>

这将在用户单击选择框之前显示"选择语言",但由于禁用了属性,用户将无法选择它.

Answer 2

如果select中的所有选项都没有selected属性,则第一个选项将是所选的选项.

要选择不是第一个的默认选项,请selected为该选项添加属性:

<option selected="selected">Select a language</option>

您可以阅读有关select元素中默认值的HTML 4.01规范.

如果您需要学习这样的HTML基础知识,我建议您阅读一本好的HTML书籍 - 我推荐 Head First HTML.

Answer 3

.selectmenu{
  
	-webkit-appearance: none;  /*Removes default chrome and safari style*/
	-moz-appearance: none; /* Removes Default Firefox style*/
	background: #0088cc ;
	width: 200px; /*Width of select dropdown to give space for arrow image*/
	text-indent: 0.01px; /* Removes default arrow from firefox*/
	text-overflow: "";  /*Removes default arrow from firefox*/ /*My custom style for fonts*/
	color: #FFF;
	border-radius: 2px;
	padding: 5px;
    border:0 !important;
	box-shadow: inset 0 0 5px rgba(000,000,000, 0.5);
}
.hideoption { display:none; visibility:hidden; height:0; font-size:0; }

Try this html

<select class="selectmenu">
<option selected disabled class="hideoption">Select language</option>
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
<option>Option 4</option>
<option>Option 5</option>
</select>