CATALOGUE Code & Data Formation XHTML/CSS Apprendre HTML5 et CSS3 / Part 2 Maîtrisez les Sélecteurs CSS pour les Éléments Adjacent

Maîtrisez les Sélecteurs CSS pour les Éléments Adjacent

Sélecteur d'éléments adjacents
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

Introduction aux Sélecteurs d'Éléments Adjacent

Objectifs

À la fin de cette vidéo, vous serez capables d'utiliser les sélecteurs CSS pour sélectionner et styliser des éléments adjacents, améliorant ainsi la gestion de vos feuilles de style.

Résumé

Apprenez à utiliser des sélecteurs CSS pour cibler des éléments adjacents dans votre code HTML, notamment les sélecteurs + et ~.

Description

Dans ce tutoriel, nous explorons les sélecteurs CSS qui permettent de sélectionner des éléments adjacents. Un élément adjacent est défini comme un élément qui suit immédiatement ou qui est positionné dans la même hiérarchie que l'élément précédent. Nous distinguons deux types de sélecteurs:

1. h1 + p: Ce sélecteur cible un élément p directement précédé par un élément h1. L'importance du mot 'immédiatement' est soulignée, signifiant que l'élément ciblé doit être directement après l'élément inspecté sans autre élément intermédiaire.

2. h1 ~ p: Ce sélecteur est plus flexible et cible tous les éléments p qui sont frères de l'élément h1, sans que ceux-ci soient nécessairement immédiats. Cela permet une sélection plus large des éléments ayant des relations de fraternité avec l'élément ciblé initial.

Grâce à ces deux sélecteurs, il devient possible de styliser efficacement les éléments de votre page HTML en fonction de leurs relations adjacentes.

Voir plus

Questions - réponses

Qu'est-ce qu'un élément adjacent en CSS?
Un élément adjacent en CSS est un élément qui suit immédiatement un autre élément dans le document HTML.
Quel est le rôle du sélecteur 'h1 + p'?
Le sélecteur 'h1 + p' cible et stylise un élément p qui est immédiatement précédé par un élément h1.
Quelle est la différence entre 'h1 + p' et 'h1 ~ p'?
Le sélecteur 'h1 + p' cible uniquement les éléments p immédiatement précédés par h1, tandis que 'h1 ~ p' cible tous les éléments p frères de h1, qu'ils soient immédiats ou non.
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