Description

modifier
 

Le CSS3 a été lancé en 1999 pour ajouter une couche de nouveaux mots clés.

 

Sélecteurs

modifier

Pour sélectionner des éléments[1] :

  • + : adjacence directe
  • ~ : adjacence indirecte
  • ^= : de début d'attribut
  • $= : de fin d'attribut
  • *= : de contenu d'attribut
  • |= : de début d'attribut suivi par un tiret (-)[2].

Pseudo-classes

modifier
  1. :active
  2. :any
  3. :any-link
  4. :checked
  5. :default
  6. :dir
  7. :disabled
  8. :empty
  9. :enabled
  10. :first
  11. :first-child
  12. :first-of-type
  13. :fullscreen
  14. :focus
  15. :hover
  16. :indeterminate
  17. :in-range
  18. :invalid
  19. :lang
  20. :last-child
  21. :last-of-type
  22. :left
  23. :link
  24. :not
  25. :nth-child
  26. :nth-last-child
  27. :nth-last-of-type
  28. :nth-of-type
  29. :only-child
  30. :only-of-type
  31. :optional
  32. :out-of-range
  33. :read-only
  34. :read-write
  35. :required
  36. :right
  37. :root
  38. :scope
  39. :target
  40. :valid
  41. :visited

Pseudo-éléments

modifier
  1. ::after
  2. ::backdrop
  3. ::before
  4. ::first-letter
  5. ::first-line
  6. ::selection

Fonctions

modifier

Le CSS3 fournit 17 fonctions supplémentaires[3], parmi lesquelles :

  • calc() réalise des calculs comprenant les quatre opérations fondamentales : addition, soustraction, multiplication et division. Exemple : width: calc(100px - 2em); padding: 1em; permet à l'élément de ne pas déborder à cause de son padding.
  • var() fait l'appel à une variable déjà attribuée. Exemple : --maCouleur: #08F; color: var(--maCouleur);

flexbox

modifier

Références

modifier