Aide-mémoire CSS II

Suite de la série de mes aides-mémoire CSS.

Activer les chiffres elzéviriens

Pour utiliser les chiffres elzéviriens, il faut travailler en CSS 3 et avoir défini une police qui les supporte, par exemple la Linux Libertine. Puis:

/* Activés */
font-feature-settings: "onum" 1;
/* Désactivés */
font-feature-settings: "onum" 0;

En fait, on active une fonctionnalité OpenType. Pour plus de détails sur le principe, voir ici, pour la liste de ce qu’on peut activer, il y a une liste avec des exemples (à partir de la page 12) et une sans exemple.

Et ça ressemble à quoi ?

Cet exemple ne fonctionne que si vous avez la Linux Libertine d’installée.

Avec:

0123456789

Sans:

0123456789

Faire des tableaux avec des lignes alternant de couleur de fond

Il faut appliquer le selecteur nth-child() sur tr. Par exemple:

/* Lignes paires */
tr:nth-child(even) td {background-color: grey;}
/* Lignes impaires */
tr:nth-child(odd) td {background-color: darkgrey;}

Appliquer une couleur de fond spécifiquement sur la première ligne d’un tableau

Cette fois, c’est le sélecteur first-child qu’il faut appliquer sur tr. Par exemple:

tr:first-child() td {background-color: green;}

Cela peut être utile si on ne sait pas si des th seront utilisés dans les tableaux.


Aucun commentaire.