Prefix

Définition

Préfixe ajouté à toutes les classes Tailwind pour éviter les collisions avec du CSS existant. En v4 le préfixe se déclare à l'import et s'écrit comme une variante : tw:flex, tw:hover:bg-red-600 (et non plus tw-flex).

Analogie

Mettre une étiquette sur tes affaires a l'école pour ne pas les confondre avec celles des autres.

Exemple de code

@import "tailwindcss" prefix(tw);

/* HTML v4 : <div class="tw:flex tw:p-4 tw:hover:bg-blue-600"> */
/* HTML v3 : <div class="tw-flex tw-p-4"> */

Cas d'usage

Intégrer Tailwind dans un projet existant avec du CSS legacy sans conflits de noms.

Termes liés

Sources

• tailwindcss.com/docs/upgrade-guide