1. Ajoutez un bloc de commentaires au début de la feuille de style pour décrire la date de création, le créateur, les balises et autres informations de remarque de la feuille de style.
| Exemple de code source : /* ---------------------------------- Site : Nom du site Auteur : 52CSS.com Mise à jour : date et heure Mis à jour par : Nom ---------------------------------- */ |
2. Inclure des marquages de couleur publics
| Exemple de code source : /* ---------------------------------- COULEURS Fond du corps : #def455 Arrière-plan du conteneur : #fff Texte principal : #333 Liens : #00600f Liens visités : #098761 Liens de survol : #aaf433 H1, H2, H3 : #960 H4, H5, H6 : #000 ---------------------------------- */ |
3. Donnez des noms significatifs à l'ID et à la classe
Méthode de dénomination non recommandée :
| Exemple de code source : .boîte verte { ... } #gros-texte { ... } |
Méthode de dénomination recommandée :
| Exemple de code source : .pullquote {... } #introduction {... } |
4. Intégrer les règles de style associées
| Exemple de code source : #en-tête { ... } #en-tête h1 { ... } #en-tête h1 img { ... } #formulaire d'en-tête { ... } #header a#skip { ... } #navigation { ... } #navigation ul { ... } #navigation ulli { ... } #navigation ul li a { ... } #navigation ul li a:hover { ... } #contenu { ... } #contenu h2 { ... } #contenu p { ... } #contentul { ... } #contentulli { ... } |
5. Ajoutez des commentaires clairs aux styles
| Exemple de code source : /* ---------------------------------- styles d'en-tête ---------------------------------- */ #en-tête { ... } #en-tête h1 { ... } #en-tête h1 img { ... } #formulaire d'en-tête { ... } /* ---------------------------------- style de navigation ---------------------------------- */ #navigation { ... } |