Les nouveaux Sélecteurs
http://www.w3.org/TR/css3-selectors/
http://www.w3.org/TR/selectors4/
En particulier
:nth-child() pseudo-class
Le :nth-child(an+b) pseudo-class represente un element qui a an+b-1 frère avant lui
Mots clefs : odd / even (impair / pair)
tr:nth-child(2n+1) /* ligne impaire d’un tableau*/
tr:nth-child(odd) /* idem*/
Autres Sélecteurs
E:last-of-type / E:first-of-type
tr > td:last-of-type : le dernier td d’une ligne (il peut y avoir des th après)
E:empty
pour les balises vides (<p></p>)
E:not(s)
un élément E qui ne vérifie pas un sélecteur simple s
Un sélecteur simple est un sélecteur de type (balise html) , sélecteur *, sélecteur sur les attributs, sélecteur de classe (.), sélecteur #, ou une pseudo-classe.
E ~ F
Un élément F précédé par un élement E
E et F ont le même parent
Transparence
Couleur transparente :
rgba : red , green, blue, alpha
p { color: rgba(0,0,255,0.5) } /* semi-transparent solid blue */
p { color: rgba(100%, 50%, 0%, 0.1) } /* very transparent solid orange */
Transparence sur un « élément » : opacity
valeur entre [0.0,1.0].
filter:alpha(opacity=9); /* pour ie 8 et avant … */
-moz-opacity:0.09 ;
-khtml-opacity: 0.09 ;
opacity: 0.09 ;
Ombres
box-shadow
box-shadow: h-shadow v-shadow blur spread color inset;
h-shadow : décalage horiziontal (vers la droite)
v-shadow : décalage vertical (vers le bas)
blur : longueur du flou
spread : taille (longeur) (en plus) de l’ombre
color : couleur de l’ombre
inset : outer (par défaut) ou inner
Text-shadow
text-shadow: h-shadow v-shadow blur color;