CATALOGUE Code & Data Formation Web App Créer une Web App - Vos sites Web sur mobiles Apprendre les Bases du Positionnement Absolu en HTML et CSS

Apprendre les Bases du Positionnement Absolu en HTML et CSS

Placer un élément en position absolute
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Créer une Web App - Vos sites Web sur mobiles
Revoir le teaser Je m'abonne
Transcription
Cette leçon fait partie de la formation
59,90€ Je commande
Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm
DescriptionProgrammeAvis
Cette leçon fait partie de la formation
59,90€ Je commande
Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

Concepts et Pratiques du Positionnement Absolu

Objectifs

Les objectifs de cette vidéo sont de :

  • Comprendre le positionnement absolu.
  • Savoir comment positionner des éléments par rapport à leurs éléments parents ou au body.
  • Apprendre à manipuler les coordonnées XY.

Résumé

Découvrez comment positionner des éléments avec précision en utilisant le positionnement absolu en HTML et CSS.

Description

Dans cette leçon, vous allez apprendre à utiliser le positionnement absolu pour placer des éléments sur une page web. En comprenant le fonctionnement de l'attribut 'position: absolute', vous pourrez positionner des éléments par rapport à leur parent ou à la fenêtre du navigateur. La leçon aborde également la différence entre le positionnement absolu et relatif, et comment ces concepts peuvent être utilisés pour créer des mises en page dynamiques et réactives. Vous verrez un exemple pratique d'ajout d'un bandeau intitulé 'crocus' sur une image, avec des explications détaillées sur le code HTML et CSS employé. Ce tutoriel est essentiel pour ceux qui souhaitent maîtriser l'agencement des éléments dans le développement web.

Voir plus

Questions fréquentes

Quelle est la différence principale entre le positionnement absolu et relatif ?
Le positionnement absolu positionne un élément par rapport à son premier parent positionné ou au body s'il n'a pas de parent positionné. Le positionnement relatif positionne un élément par rapport à sa position normale dans le flux du document.
Pourquoi le bandeau crocus ne bougeait-il pas initialement après l'avoir cloné ?
Parce que l'élément conteneur n'était pas positionné. Pour que l'élément crocus se positionne par rapport à son parent, ce parent doit être positionné.
Comment centrer un élément conteneur horizontalement ?
Pour centrer un élément conteneur horizontalement, il faut lui donner une largeur fixe et appliquer la propriété CSS 'margin' avec les valeurs '0 auto'.

Programme détaillé