Introduction et Création de la Structure HTML
Objectifs
Les objectifs de cette vidéo sont de :
1. Comprendre le concept de positionnement absolu en CSS.
2. Apprendre à structurer le code HTML et CSS pour positionner des images.
3. Maîtriser l'utilisation des classes et des pseudo-éléments CSS pour le style.
Résumé
Découvrez comment positionner des images en absolu en utilisant le CSS à travers ce guide étape par étape.
Description
Dans cette leçon, nous allons explorer la création d'une composition avec des images en positionnement absolu. Nous commencerons par la structure HTML de base, où nous ajouterons un lien vers un fichier CSS. Ensuite, nous placerons quatre images à l'intérieur d'une section, en utilisant des classes pour faciliter le style.
Nous apprendrons à ajouter une classe qui signifiera que le parent est en positionnement relatif. Ceci est crucial parce que les éléments en positionnement absolu se positionnent par rapport à leur parent. Ensuite, en utilisant le sélecteur nthChild, nous positionnerons chaque image différemment en utilisant les propriétés CSS top et left.
Enfin, nous verrons comment ajuster la hauteur de l'élément parent pour assurer que le contenu s'affiche correctement dans le navigateur. Cette leçon vous aidera à mieux comprendre le flux de positionnement en CSS et améliorer vos compétences en web design.
Dommage.