Maison >interface Web >tutoriel CSS >Comment puis-je appliquer la même propriété CSS à plusieurs classes simultanément ?

Comment puis-je appliquer la même propriété CSS à plusieurs classes simultanément ?

Susan Sarandon
Susan Sarandonoriginal
2024-11-02 16:39:021073parcourir

How can I apply the same CSS property to multiple classes simultaneously?

Application simultanée de styles à plusieurs classes

En CSS, il est souvent souhaitable d'appliquer la même propriété à plusieurs classes. Ceci peut être réalisé en séparant les noms de classe par des virgules, créant ainsi une liste de classes auxquelles la propriété s'applique.

Par exemple, considérons l'extrait CSS suivant, qui applique la même propriété margin-left à deux classes. , ".abc" et ".xyz":

<code class="css">.abc, .xyz {
  margin-left: 20px;
}</code>

Ce code fera en sorte que les classes .abc et .xyz aient la même valeur de marge gauche de 20 pixels.

Ceci Cette approche peut être particulièrement utile lorsque vous souhaitez appliquer la même propriété à plusieurs classes ayant un objectif similaire. En consolidant les styles en une seule règle, vous pouvez éviter la répétition du code et rendre votre CSS plus efficace.

Dans l'exemple fourni :

<a class="abc">Lorem</a>
<a class="xyz">Ipsum</a>

Les deux les éléments auront une marge gauche de 20 pixels en raison de la règle combinée .abc, .xyz { margin-left: 20px; }.

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