Explication graphique détaillée des différences entre les listes ordonnées, les listes non ordonnées et les listes personnalisées en HTML

Les listes sont souvent utilisées dans la mise en page. Les listes sont divisées en listes ordonnées, listes non ordonnées et listes personnalisées. Connaissez-vous la différence entre les listes ordonnées, les listes non ordonnées et les listes personnalisées ? Cet article vous présentera les balises utilisées dans les listes ordonnées, les listes non ordonnées et les listes personnalisées, ainsi que les différences entre les trois. Il a une certaine valeur de référence et les amis intéressés peuvent y jeter un œil.

1. Liste non ordonnée

La balise

est utilisée pour définir une liste non ordonnée, utilisez la balise
, Vous pouvez créer une liste non ordonnée.

Exemple : Utiliser une liste non ordonnée pour lister quatre grands classiques. Le code est le suivant :


<ul>
   <li>红楼梦</li>
   <li>水浒传</li>
   <li>三国演义</li>
   <li>西游记</li>
</ul>

Rendu :



Le type d'attribut de liste non ordonnée, le style par défaut est un petit cercle noir, qui est un disque. Les attributs de type incluent le disque (cercle plein par défaut), le cercle (cercle creux), le carré (carré plein) et aucun (annuler le préfixe).

2. Liste ordonnée

peut définir une liste ordonnée, utilisez la balise
peut créer une liste ordonnée, où l'ordre de la liste est affiché numériquement.

L'exemple de code est le suivant :

<ol>
   <li>红楼梦</li>
   <li>水浒传</li>
   <li>三国演义</li>
   <li>西游记</li>
</ol>

Rendu :



La liste ordonnée a deux attributs, à savoir type et start . type a cinq valeurs d'attribut : 1, a, A, i, I (chiffres romains), qui sont utilisées pour indiquer le style du préfixe de liste. start indique à partir de quel numéro du type commencer. Par exemple, lorsque type = "a" et start = "4", cela signifie que le type de lettre minuscule est sélectionné et que la liste commence à partir de la quatrième lettre d.

3. Liste personnalisée

peut définir une liste de description, et la balise

;dd> , créez une liste personnalisée (liste de description).

L'exemple de code est le suivant :

<dl>
     <dt>中国四大名著</dt>
       <dd>红楼梦</dd>
      <dd>西游记</dd>
       <dd>水浒传</dd>
       <dd>三国演义</dd>
</dl>

Rendu :



Dans la liste personnalisée (liste de description), en dt Et dd Il y a un retrait dans .

La différence entre les listes ordonnées, les listes non ordonnées et les listes personnalisées :

Les listes ordonnées et les listes non ordonnées ont des préfixes, mais les listes ordonnées ont des lettres majuscules, des lettres minuscules et des chiffres. et chiffres romains, etc., tandis que les préfixes des listes non ordonnées sont des cercles pleins, des cercles creux, des carrés pleins. La différence entre une liste personnalisée, une liste ordonnée et une liste non ordonnée est qu'elle a une indentation mais pas de préfixe.

【Tutoriels associés recommandés】

1. Tutoriel vidéo CSS3
2 Manuel CSS en ligne
3. tutoriel bootstrap

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!