CATALOGUE Code & Data Formation XHTML/CSS Apprendre HTML5 et CSS3 / Part 2 Maîtriser les Propriétés d'Affichage en CSS

Maîtriser les Propriétés d'Affichage en CSS

Propriétés d'affichage
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Apprendre HTML5 et CSS3 / Part 2
Revoir le teaser Je m'abonne
1,0
Transcription
39,90€ Je commande
Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm
DescriptionProgrammeAvis
1,0
39,90€ Je commande
Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

Comprendre Visibility et Display

Objectifs

Les objectifs de cette vidéo sont d'apprendre :

  • À utiliser les propriétés visibility et display
  • À comprendre les différences entre display: block, display: inline, et display: inline-block
  • À implémenter des menus en ligne avec CSS

Résumé

Cette leçon explore les propriétés d'affichage CSS visibility et display, illustrant comment elles affectent la présentation et le positionnement des éléments sur une page web.

Description

Dans cette leçon, nous examinons les propriétés d'affichage en CSS, notamment les propriétés visibility et display. La propriété visibility peut rendre un élément visible ou hidden, tandis que la propriété display peut enlever un élément de la mise en page avec display: none. Nous avons également exploré comment transformer le comportement des éléments block et inline via display: inline-block, permettant une flexibilité accrue dans la mise en forme des menus et des layouts.

Nous avons démontré comment display: inline aligne les éléments li horizontalement et comment vertical-align: top permet un alignement parfait sur la ligne de base. Cette leçon est essentielle pour maîtriser la gestion de l'affichage des éléments HTML afin d'améliorer l'expérience utilisateur et le design web.

Voir plus

Questions - réponses

Quelle est la différence entre visibility et display?
La propriété visibility cache un élément sans le retirer du flux du document, tandis que display: none cache également l'élément mais le retire du flux du document.
Quelles sont les valeurs possibles pour la propriété display?
Les valeurs de la propriété display incluent notamment block, inline, none, et inline-block, chacune modifiant différemment le comportement des éléments.
Pourquoi utiliser display: inline-block?
Display: inline-block permet de combiner les propriétés de block et d'inline, permettant d'appliquer des dimensions tout en gardant les éléments alignés horizontalement.
1 commentaire
1,0
1 vote
5
4
3
2
1
eve.bertieaux
Il y a 2 years
Commentaire
C'est vraiment dommage que lors de la démonstration HTML et CSS soient mélangés, je ne sais plus à un moment donné si c'est dans l'un ou l'autre, du coup je n'ai pas le résultat attendu