How to hide option in html

Method: 1. Set the hidden attribute to the option tag with the syntax "

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

htmlHow to hide option

Method 1: Set the hidden attribute to the option tag

The browser should not display elements that have the hidden attribute specified.

<select>
  <option>默认---喜欢什么水果</option>
  <option hidden="hidden">苹果</option>
  <option>梨子</option>
  <option>桃子</option>
  <option>香蕉</option>
</select>

Method 2: Add the "display:none" style to the option tag

<select>
  <option>默认---喜欢什么水果</option>
  <option hidden="hidden">苹果</option>
  <option style="display: none;">梨子</option>
  <option>桃子</option>
  <option>香蕉</option>
</select>

Method 3: Add the "visibility:hidden" style to the option tag

<select>
  <option>默认---喜欢什么水果</option>
  <option hidden="hidden">苹果</option>
  <option style="display: none;">梨子</option>
  <option>桃子</option>
  <option style="visibility: hidden;">香蕉</option>
</select>

Recommended tutorial: "html video tutorial"

The above is the detailed content of How to hide option in html. For more information, please follow other related articles on the PHP Chinese website!