Un codeur de page Web utilise le langage de balisage hypertexte pour indiquer au navigateur Web l'objectif fonctionnel de chaque élément d'une page, tel qu'un paragraphe, un titre ou une liste. Depuis HTML 4, les feuilles de style en cascade ont fourni au codeur un moyen de dire au navigateur à quoi chacun de ces éléments devrait ressembler, indépendamment de la définition de ce qu'ils sont. Une page peut avoir différents styles CSS pour différents types d'appareils, tels que les téléphones mobiles et les ordinateurs de bureau, ce qui permet de modifier l'apparence de la page sans que le codeur ait besoin de modifier le code HTML. Utilisez les propriétés CSS pour centrer une image.

Étape 1

Placez la balise "img" dans le fichier HTML où vous voulez que votre image s'affiche sur la page Web. Il doit être entre les balises "body" et après les balises "h1". Par exemple,

Ceci est votre texte.

définit une image nommée photo.jpg qui mesure 170 pixels de large et 50 pixels de haut. C'est la première chose sur la page après le titre supérieur.

Étape 2

Utilisez l'attribut CSS "margin" pour définir l'espace autour des éléments de la page, tels que les images. La valeur "auto" de l'attribut margin indique au navigateur Web de déterminer automatiquement la quantité d'espace. Donc, définit que l'espace autour de l'image est déterminé par le navigateur.

Étape 3

Utilisez la propriété "display" pour définir comment un élément de page est affiché. La valeur "block" de la propriété display indique au navigateur Web d'afficher l'élément sur sa propre ligne, avec un espace au-dessus et en dessous. Donc, définit la même image, mais l'ajout de "display:block;" le place maintenant sur sa propre ligne.

Étape 4

Affichez la page Web dans plusieurs navigateurs différents pour vérifier que l'image est correctement centrée.

Astuce

Incluez la description de l'image dans une balise "alt". Cela rend votre page plus accessible aux lecteurs malvoyants et garantit que votre code est conforme aux normes.