Retour à la liste

Les sélecteurs en css3

Créé : 14.05.2013, 09:58:07  -  Modifié : 12.05.2018, 05:35:21

Sélecteurs combinés

Sélecteurs combinés conditions
h1, h2, h3 toutes les balises h1, h2, h3
div p p est descendantde div
#header > p toutes les balises p enfant de #header
h1 + h2 une balise h2 adjacente à h1
h1 ~ p tous <p> avec les mêmes parents que <h1>

Sélecteurs d'attribut

Sélecteurs d'attribut conditions
a[href] <a> ayant un lien
a[title="accueil" <a> ayant titre "accueil"
img[class~="thumb"] les valeurs des classes sont séparées par un espace. une des valeur est "thumb"
h1[lang|="en"] <h1 lang="en-US">content</h1>
valeur = séparées par '-'
a[href^="http://"] l'adresse du lien commence par "http://"
a[href$=".pdf"] l'adresse du lien finit par ".pdf"
div[id*="main"] div avec un identifiant contient "main"
(sensible à la casse)

Pseudo-classes

Sélecteurs conditions
enabled /desabled est activé / désactivé
checked coché
h1:not([title]) h1 qui n'a pas d'attribut 'title'
div:target cible d'un lien (c-a-d l'ancre nommée)

Sélecteurs structurels (pseudo-classes)

Sélecteurs conditions (tj par rapport au parent direct)
:first-child premier enfant
:last-child dernier enfant
:only-child seul enfant
:first-of-type premier du type
:empty élément vide
:nth-child(n) enième enfant (ordre = n)
:nth-last-child(n)  
:nth-of-type(n)  
:nth-last-of-type(n)  
:nth-child(2n) pairs
:nth-child(2n+1) impairs

 


Rendu :0.3674 | Mémoire :2.87MB

Accueil | Informations | Top