Il existe quatre méthodes de sélection les plus couramment utilisées,
la sélection de règles d'identification, telles que
la citation de contenu
bouton#bouton{}
#urlBar[type="text"] { }
div > p > span#demo{}
Sélection de règles de classe, comme
citer du contenu
bouton.toolbarButton { }
.fancyText { }
menuitem > .menu-left[checked="true"] { }
Sélection de règles de balise, comme
citer du contenu
td { }
div > p { }
input[ type= "checkbox"] { }
Sélecteurs uniformes, tels que
le contenu de référence
*
: après
[hidden="true"]
Ils commencent tous à correspondre à partir de l'extrême droite jusqu'à la fin de la règle entière à l'extrême gauche.
Il y a un problème. Par exemple, la règle la plus à droite peut déjà déterminer l'élément que vous souhaitez sélectionner.
Une plus grande correspondance de règles entraînera un gaspillage de performances.
Par exemple, div > p > span#demo{}
div > p > span n'a aucun sens.
Amélioration :
les identifiants sont uniques. Il n’est pas nécessaire d’attacher des règles redondantes. Il peut également être adapté avec précision.
Citer le contenu
du bouton#button{} -> #button{}
#urlBar[type="text"] { } -> #urlBar{}
div > p > span#demo{} -> #demo{}
Ce qui suit ne devrait pas apparaître <a class="toolbarButton"></a>Il peut donc également être optimisé.
Citer le contenu
button.toolbarButton { } -> .toolbarButton{}
utilise trop de règles. Il est préférable de donner directement une classe à l'élément.
Par exemple : div > p > span > a{}
peut donner une performance spéciale. Écrivez simplement une classe pour un directement.
Les situations particulières nécessitent un traitement spécial.
Par exemple, vous devez parfois vous assurer que la structure de la page est propre. Cette méthode est utilisée pour répondre aux besoins des révisions ultérieures. C'est également possible. Trouvez la meilleure solution en équilibre.
Utiliser l'héritage
#demo .left{text-align:left} ->#demo{text-align:left}
Remarque : XUL est utilisé dans l'article original. Pour les étudiants qui n'ont pas été exposés à XUL, les balises peuvent paraître un peu. étrange, mais ce n'est pas difficile à comprendre.