• Les Sélecteurs

    SelecteurExempleExplicationCSS
    .classe .exemple Selectionne tous les éléments avec class="exemple" 1
    #id #prenom Selectionne l'élément avec id="prenom" 1
    * * Selectionne tous les éléments 2
    element h1 Selectionne tous les éléments <h1> 1
    element,element div,p Selectionne toutes les balises <div> et toutes les balises <p> 1
    element element div p Selectionne toutes les balises <p> contenues dans les balises <div> 1
    element>element div>p Selectionne toutes les balises <p> dont le parent est une balise <div> 2
    element+element div+p Selectionne les balises <p> placées immédiatement après une balise <div> 2
    [attribut] [target] Selectionne tous les éléments qui ont un attribut target 2
    [attribut=valeur] [target=_blank] Selectionne tous les éléments dont l'attribut target="_blank" 2
    [attribut~=valeur] [title~=fleur] Selectionne tous les éléments dont l'attribut title contient le mot "fleur" 2
    [attribut|=valeur] [lang|=fr] Selectionne tous les éléments dont l'attribut lang commence par "fr" 2
    :link a:link Selectionne tous les liens non visités 1
    :visited a:visited Selectionne tous les liens visités 1
    :active a:active Selectionne le lien actif 1
    :hover a:hover Selectionne les liens survolés par la souris 1
    :focus input:focus Selectionne l'élément input qui a le focus 2
    :first-letter p:first-letter Selectionne la première lettre de chaque balise <p>_ 1
    :first-line p:first-line Selectionne la première ligne de chaque élément <p> 1
    :first-child p:first-child Selectionne chaque élément <p> qui est le premier enfant de son parent 2
    :before p:before Insère du contenu avant chaque élément <p> 2
    :after p:after Insère du contenu après chaque élément <p> 2
    :lang(langage) p:lang(it) Sélectionne chaque élément <p> avec la valeur de l'attribut lang commençant par "it" 2
    element1~element2 p~ul Sélectionne chaque élément <ul> qui est précédé d'un élément <p> 3
    [attribut^=valeur] a[src^="https"] Sélectionne chaque élément <a> dont la valeur de l'attribut source commence par "https" 3
    [attribut$=valeur] a[src$=".pdf"] Sélectionne chaque élément <a> dont la valeur de l'attribut src finit par ".pdf" 3
    [attribut*=valeur] a[src*="eklablog"] Sélectionne chaque élément <a> dont la valeur de l'attribut src contient la chaine "eklablog" 3
    :first-of-type p:first-of-type Sélectionne chaque élément <p> qui est le premier élément <p> de son parent 3
    :last-of-type p:last-of-type Sélectionne chaque élément <p> equi est le dernier élément <p> de son parent 3
    :only-of-type p:only-of-type Sélectionne chaque élément <p> qui est le seul élément <p> de son parent 3
    :only-child p:only-child Sélectionne chaque élément <p> qui est le seul enfant de son parent 3
    :nth-child(n) p:nth-child(2) Sélectionne chaque élément <p> qui est le secont enfant de son parent 3
    :nth-last-child(n) p:nth-last-child(2) Sélectionne chaque élément <p> qui est le secont enfant de son parent en partant du dernier 3
    :nth-of-type(n) p:nth-of-type(2) Sélectionne chaque élément <p> qui est le second élément <p> de son parent 3
    :nth-last-of-type(n) p:nth-last-of-type(2) Sélectionne chaque élément <p> qui est le second élément <p> de son parent, en comptant depuis le dernier 3
    :last-child p:last-child Sélectionne chaque élément <p> qui est le dernier enfant de son parent 3
    :root :root Sélectionne l'élément racine du document 3
    :empty p:empty Sélectionne chaque élément <p> qui n'a pas d'enfant.(Y compris les noeuds texte) 3
    :target #news:target Selects the current active #news element (clicked on a URL containing that anchor name) 3
    :enabled input:enabled Sélectionne chaque élément <input> actif 3
    :disabled input:disabled Sélectionne chaque élément <input> désactivé 3
    :checked input:checked Sélectionne chaque élément <input> coché 3
    :not(selecteur) :not(p) Sélectionne tous les éléments qui ne sont pas des <p> 3
    ::selection ::selection Sélectionne l'élément surligné 3

  • Commentaires

    1
    Dimanche 12 Octobre 2014 à 10:10

    Bravo pour tes blogs. Je viens de lire un article sur Hadopi sur un des autres, c'est clairement amusant !

    En tous cas, merci pour ton aide précieuse, tes codes css fonctionne à merveille !

    2
    Dimanche 12 Octobre 2014 à 10:11

    Pas de problème  ^^

    En ce moment je développe http://jslibrairie.ek.la/ , il y a pas mal de choses sympas

    Suivre le flux RSS des commentaires


    Ajouter un commentaire

    Nom / Pseudo :

    E-mail (facultatif) :

    Site Web (facultatif) :

    Commentaire :