Untuk mencipta CSS dengan lebih pantas, kami boleh menetapkan berbilang kelas kepada satu elemen HTML dan menggayakan setiap kelas secara berasingan. Pendekatan ini membolehkan kami menguruskan redundansi dalam aplikasi gaya. Kami boleh menggunakan gaya biasa pada banyak kelas dan gaya khusus kategori pada kategori tertentu.
<tag_name class="class_1 class_2">
Dalam contoh di bawah, kami menggunakan gaya kelas "Varma" untuk digunakan pada dua perenggan, dan perenggan kedua menggunakan gaya varma1 kelas kedua.
<!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>
Dalam contoh berikut kami menambah dua gaya pada satu teks dengan mengisytiharkan gaya .bg-biru dan .teks-putih.
<!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>
Atas ialah kandungan terperinci Menggunakan berbilang kelas CSS untuk satu elemen dalam HTML. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
