Maison >interface Web >tutoriel CSS >Les éléments de style CSS peuvent-ils être basés sur plusieurs classes simultanément ?

Les éléments de style CSS peuvent-ils être basés sur plusieurs classes simultanément ?

Susan Sarandon
Susan Sarandonoriginal
2024-12-14 06:13:11733parcourir

Can CSS Style Elements Based on Multiple Classes Simultaneously?

Les éléments de style CSS peuvent-ils être basés sur plusieurs classes ?

La sélection d'éléments basés sur plusieurs classes peut être utile pour styliser des mises en page complexes. Sans utiliser JavaScript, vous pouvez y parvenir en enchaînant les sélecteurs CSS sans espaces entre eux.

Par exemple, pour appliquer une règle de style à une balise li qui possède à la fois les classes .left et .ui-class-selector :

li.left.ui-class-selector {
    /* style here */
}

Cette règle CSS correspondra et stylisera uniquement les éléments qui ont à la fois les classes .left et .ui-class-selector appliqué.

Voici un autre exemple de sélecteur CSS plus complexe :

div.container .item.active.hovered {
    /* style here */
}

Cette règle ne fera correspondre et stylera que les éléments qui ont les éléments suivants classes:

  • .container
  • .item
  • .active
  • .hovered

Notez que la commande des classes dans le sélecteur est important. La règle ne correspondra qu'aux éléments dont les classes sont appliquées dans l'ordre spécifié.

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn