HTML <option>标签 label属性

  HTML <option> 标签

option标签的label属性短文本选项。在<option>如果使用了label属性，该值就会在下拉列表中会显示，如果<option>标签开闭之间有值就会覆盖它。

select案例

显示更短拉下选项名称

后端前端样式脚本数据库

<select name="ming">
<option value="PHP" label="P">后端</option>
  <option value="HTML" label="H">前端</option>
  <option value="CSS" label="C">样式</option>
  <option value="JavaScript" label="J">脚本</option>
  <option value="MYSQL" label="M">数据库</option>
</select>

更短选项

火狐浏览器不支持<option>嵌套<select>标签的label属性,可以支持<option>嵌套<datalist>标签的label属性

语法

<option label="值"></option>

datalist案例

datalist案例和select案例效果相同

写法一:

<input list="lists" name="ming">
<datalist id="lists">
<option value="PHP" label="P">后端</option>
  <option value="HTML" label="H">前端</option>
  <option value="CSS" label="C">样式</option>
  <option value="JavaScript" label="J">脚本</option>
  <option value="MYSQL" label="M">数据库</option>
</datalist>

写法二：

<input list="lists" name="ming">
<datalist id="lists">
<option value="PHP" label="P">
  <option value="HTML" label="H">
  <option value="CSS" label="C">
  <option value="JavaScript" label="J">
  <option value="MYSQL" label="M">
</datalist>

语法

<option label="M">

或

<option label="M"></option>

支持浏览器