1.Réinitialiser
Vraiment, utilisez toujours une réinitialisation, qu'il s'agisse de la réinitialisation Eric Meyer, de la réinitialisation YUI ou de votre propre réinitialisation personnalisée, assurez-vous de l'utiliser.
Cela peut être aussi simple que de supprimer les attributs margin et padding de tous les éléments :
html, corps, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote,
pré, formulaire, champs, table, th, td { marge : 0 ; remplissage : 0 ;
Le style Resets d'Eric Meyer et YUI est génial, mais pour moi, ils vont trop loin. Je veux que vous effaciez tout avant de redéfinir de nombreuses propriétés de l'élément. C’est ce que préconise Eric Meyer. S'il existe un moyen plus efficace de l'utiliser, vous ne devriez pas simplement prendre son fichier de style et le déposer directement dans votre propre projet - l'affiner, le reconstruire, le personnaliser.
Oh, s'il te plaît, ne recommence pas :
* { marge : 0 ; remplissage : 0 ;
Il est utilisé à trop d’endroits. Si vous supprimez le remplissage d’un bouton radio, que pensez-vous qu’il se passera ? Les éléments de formulaire ont parfois un aspect funky, il est donc préférable de les laisser tels quels.
2. Trier par ordre alphabétique
un petit test
Parmi les deux exemples ci-dessous, lequel, selon vous, peut trouver l'emplacement de l'attribut margin-right plus rapidement ?
Exemple 1
div#en-tête h1 {
indice z : 101 ;
couleur : #000 ;
position : relative ;
hauteur de ligne : 24 px ;
marge droite : 48 px ;
bordure inférieure : 1px solide #dedede ;
taille de police : 18 px ;
}
Exemple 2
div#en-tête h1 {
bordure inférieure : 1px solide #dedede ;
couleur : #000 ;
taille de police : 18 px ;
hauteur de ligne : 24 px ;
marge droite : 48 px ;
position : relative ;
indice z : 101 ;
}
Ne me dites pas que l'exemple 2 n'est pas aussi rapide que l'exemple 1 ! En triant les propriétés de ces styles par ordre alphabétique, la cohérence que vous créez vous aidera à réduire le temps passé à rechercher un bien spécifique.
Je sais que certaines personnes organisent l'ordre de cette façon, et d'autres utilisent une autre façon d'organiser l'ordre des styles. Mais dans mon entreprise, nous avons décidé à l’unanimité de trier les choses par ordre alphabétique. Cette approche fonctionnera certainement pour vous lorsque vous développerez du code avec d'autres. Je déteste chaque fois que je vois une feuille de style non triée par ordre alphabétique, car elle a l'air désordonnée et désorganisée...