為了更快地創建CSS，我們可以給單個HTML元素賦予多個類，并分別為每個類設置樣式。這種方法允許我們管理樣式應用的冗余。我們可以將通用樣式應用于許多類，而將特定類別的樣式應用于特定類別。
語法
<tag_name class="class_1 class_2">
登錄后復制
Example
在下面的示例中，我們使用class“Varma”的樣式來應用于兩個段落，而第二個段落應用了secondclass varma1的樣式。
<!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>
登錄后復制
執行上述腳本后將生成結果。它是文本“歡迎來到tutorialspoint”與兩個CSS樣式以及文本“大家好”與單個CSS樣式的組合。
Example: Using javascript
In the following example we are adding two style to an single text by declaring the .bg-blue style and .text-white style.
<!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>
登錄后復制
在執行時，腳本生成一個應用了兩個CSS樣式的文本輸出：“歡迎來到教程點”。
以上就是在HTML中為一個元素使用多個CSS類的詳細內容，更多請關注www.92cms.cn其它相關文章！
