Maison >interface Web >tutoriel CSS >Comment aligner horizontalement des `` éléments à l'intérieur d'un `` avec CSS ?

Comment aligner horizontalement des `` éléments à l'intérieur d'un `` avec CSS ?

Barbara Streisand
Barbara Streisandoriginal
2024-12-06 08:19:10646parcourir

How to Horizontally Align `` Elements Inside a `` with CSS?

Affichage horizontal des éléments de liste dans
    Utilisation de CSS

Question :

Comment pouvez-vous aligner horizontalement

  • éléments dans un
      en utilisant CSS ?

      Réponse :

      Pour afficher les éléments de la liste horizontalement, nous devons modifier leur comportement inhérent aux éléments de bloc et les transformer en éléments en ligne à l'aide de la propriété d'affichage.

      Correction du code :

      Dans le code fourni, la propriété display: inline est appliquée directement à le

        , qui n'a aucun effet sur les éléments de la liste. Au lieu de cela, nous devrions sélectionner spécifiquement les éléments de la liste :

        #ul_top_hypers li {
          display: inline;
        }

        Explication :

        En appliquant la propriété display: inline à chaque

      • élément, ils deviennent des éléments en ligne. Les éléments en ligne circulent horizontalement dans le conteneur parent environnant, leur permettant de s'aligner horizontalement.

        Exemple de travail :

        L'extrait de code mis à jour suivant affichera les éléments de la liste horizontalement :

        <div>

        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!

  • Déclaration:
    Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn