Classes CSS : espace ou pas d'espace : quelle est la différence ?

Classes CSS : avec espace ou sans espace

En CSS, il existe deux façons d'écrire des sélecteurs de classe : avec espace (.class .class) et sans espace (.class.class). Chaque syntaxe sert un objectif différent.

Sans espace : .class.class

Cette syntaxe indique que l'élément doit avoir les deux classes pour correspondre au sélecteur. Par exemple, .element.large .symbol sélectionnerait n'importe quel élément .symbol qui se trouve dans un élément .element qui possède également la grande classe.

Avec espace : .class .class

Cette syntaxe indique que l'élément doit avoir les deux classes dans n'importe quel ordre. Par exemple, .element .symbol sélectionnerait n'importe quel élément .symbol qui se trouve dans un élément .element. Cependant, il sélectionnerait également tout élément .element qui possède une classe .symbol, quelle que soit sa position dans le document.

Exemple :

Considérez le CSS suivant :

.element {
  color: black;
}

.large {
  font-size: 2em;
}

.symbol {
  font-family: monospace;
}

• .element .symbol sélectionnerait tous les éléments .symbol qui se trouvent dans les éléments .element, et ils hériteraient du style color: black de .element.
• .element.large .symbol sélectionnerait tous les éléments .symbol qui se trouvent dans les éléments .element qui ont également la grande classe, et ils hériteraient de la couleur : noir et taille de police : styles 2em.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!