Contenu

• Pas
• Méthode 1 sur 2 : CSS (recommandé)
• Méthode 2 sur 2: L'attribut "align" en HTML

Attribut aligner étiqueter html> est obsolète depuis HTML5. Bien que cet attribut fonctionne toujours dans la plupart des navigateurs Web, il est recommandé d'aligner les images à l'aide de feuilles de style en cascade (CSS). Dans cet article, nous allons vous montrer comment centrer des images à l'aide de CSS et de la balise dépréciée. aligner.

Pas

Méthode 1 sur 2 : CSS (recommandé)

1. 1 Ajoutez du code HTML pour l'image. Vous utiliserez des feuilles de style en cascade (CSS) pour aligner l'image, mais vous devrez la placer sur la page en utilisant HTML. Voici un exemple d'utilisation de la balise img> pour insérer une image dans votre code :

   img src = "dog.webp" alt = "c'est une photo d'un chien">

   • À la place de chien.webp remplacez le nom du fichier image, et après le "alt" entrez la description de l'image. Sens centre pour "class" ne changez pas, car vous allez créer une classe CSS avec ce nom.
2. 2 Trouvez le code CSS. Si votre site a un fichier CSS séparé, ouvrez-le. Sinon, le CSS est très probablement en haut du fichier HTML, à l'intérieur des balises tête>... Faites défiler vers le haut du fichier pour trouver les balises style> / style>.
   • Si les balises style> / style> non, ajoute-les. Lisez cet article pour plus d'informations.
3. 3 Ajoutez du CSS pour aligner l'image. Au lieu de "50 %", vous pouvez saisir une valeur différente pour que l'image apparaisse sur la page. Vous ne pourrez pas centrer l'image avec une valeur de "100%", donc ce nombre devrait être différent.

   .center {afficher : bloc ; marge-gauche : auto ; marge-droite : auto ; largeur : 50 % ; }

4. 4 Enregistrez vos modifications. Enregistrez le fichier HTML et le fichier CSS (le cas échéant). Cela centrera l'image.
   • Également à l'intérieur des balises img> peut ajouter pour centrer d'autres images.

Méthode 2 sur 2: L'attribut "align" en HTML

1. 1 Créez un nouveau paragraphe. Bien que cette méthode de centrage des images ait été dépréciée, elle fonctionne toujours dans de nombreux navigateurs. Cependant, nous vous recommandons d'utiliser CSS pour que le site reste fonctionnel lorsque les navigateurs cessent de prendre en charge l'attribut spécifié. N'oubliez pas que l'attribut aligner centrera l'image uniquement à l'intérieur de l'élément qui l'entoure (par exemple, à l'intérieur des balises p> / p> ou alors div> / div>). A titre d'exemple, dans le fichier HTML, nous allons créer un nouveau paragraphe en ajoutant p> sur une ligne séparée.
2. 2 Ajoutez du code HTML pour l'image. Entrez le code suivant après la balise p>... Utilisez cet exemple comme guide :

   p> img src = "chien.webp" alt = "image" align = "milieu">

   • À la place de chien.webp remplacez le nom du fichier image, et après le "alt" entrez la description de l'image.
   • L'attribut middle indique au navigateur d'afficher l'image au centre de la page.
3. 3 Fermez la balise de paragraphe. Pour ce faire, ajoutez /p> après l'étiquette de l'image. Le code fini devrait ressembler à ceci :

   p> img src = "chien.webp" alt = "image" align = "milieu"> / p>

4. 4 Enregistrez vos modifications. Cela centrera l'image.