Il existe deux façons de convertir une liste verticale en liste horizontale. Utilisez des éléments de liste en ligne ou flottants.
Les deux méthodes conviennent, mais si vous voulez que les liens aient la même taille, vous devez utiliser la méthode float.
Éléments de liste en ligne
Une façon de créer une barre de navigation horizontale consiste à spécifier l'élément,
instance
li{
display:inline;
}affichage :inline; - Par défaut, l'élément
Éléments de liste flottante
Dans l'exemple ci-dessus, les liens ont des largeurs différentes.
Pour que tous les liens aient la même largeur, faites flotter l'élément
Instance
li{
float:left;
}
a{
display:block;
width:60px;
}float:left - utiliser des diapositives d'éléments de bloc flottants les uns à côté des autres
display:block - affiche des liens vers des éléments de bloc, rendant toute la zone de lien cliquable (pas seulement le texte), cela nous permet de spécifier la largeur
width:60px - La largeur maximale des éléments de bloc par défaut. Nous voulons spécifier une largeur de 60 pixels
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!
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
