Pour créer du CSS plus rapidement, nous pouvons attribuer plusieurs classes à un seul élément HTML et styliser chaque classe séparément. Cette approche nous permet de gérer la redondance dans le style applicatif. Nous pouvons appliquer des styles communs à de nombreuses classes et des styles spécifiques à une catégorie à des catégories spécifiques.
<tag_name class="class_1 class_2">
Dans l'exemple ci-dessous, nous utilisons le style de classe « Varma » pour l'appliquer à deux paragraphes, et le deuxième paragraphe a le style de seconde classe varma1 appliqué.
<!DOCTYPE html>
<html>
<style>
.varma {
font-size: larger;
margin-bottom: 35px;
background-color: lightgreen;
}
.varma1 {
color: red;
}
</style>
<body>
<p class="varma">
Hello Everyone.
</p>
<p class="varma varma1">
Welcome to Turorialspoint.
</p>
</body>
</html>
Dans l'exemple suivant, nous ajoutons deux styles à un seul texte en déclarant le style .bg-blue et le style .text-white.
<!DOCTYPE html>
<html>
<style>
.bg-blue {
background-color: lightgreen;
}
.text-white {
color: red;
}
</style>
<body>
<div id="varma">Welcome To Tutorialspoint</div>
<script>
const box = document.getElementById('varma');
box.classList.add('bg-blue', 'text-white');
</script>
</body>
</html>
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!
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
