Liste déroulante hiérarchique en HTML

Lors de la création d'une page Web, s'il y a beaucoup d'informations classifiées, vous pouvez également les afficher de manière hiérarchique dans la liste déroulante, qui est une option d'affichage plus claire pour les utilisateurs. Dans l'exemple suivant, vous pouvez voir que les options de la liste déroulante sont affichées hiérarchiquement. Les résultats de l'exécution du programme sont présentés dans la figure.

Cet exemple applique principalement la balise optgrounp et définit son attribut label . La balise optgroup est principalement utilisée pour regrouper logiquement les options dans l'élément select. Le texte spécifié dans la balise optgroup n'est pas facultatif. Généralement, les options peuvent être distinguées en remplaçant le champ de texte.

Le code clé pour implémenter la liste déroulante hiérarchique est le suivant :

<form id="form1" name="form1" method="post" action="">
  <table width="206" border="0" align="center" cellpadding="0" cellspacing="0">
    <tr>
      <td height="25" background="images/mid_01.jpg">     图书分类</td>
    </tr>
    <tr>
      <td height="28" align="center"><select name="book_class" id="book_class">
          <optgroup label="Web设计">
          <option>网站建设</option>
          <option>网页设计</option>    
          <option>JavaScript程序设计</option>
          </optgroup>    
          <optgroup label="软件世界">
          <option>软件工程</option>
          <option>软件应用</option>
          </optgroup>
        </select></td>
    </tr>
  </table></form>

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!