Rumah > Artikel > hujung hadapan web > Bagaimana untuk menggunakan gaya pada berbilang kelas sekaligus?
Bagaimana untuk menggunakan gaya pada berbilang kelas sekaligus?
- 王林ke hadapan
- 2023-08-19 09:33:16966semak imbas
Untuk Menggunakan Gaya pada kelas Muitliple sekaligus kita akan menggunakan pemilih dot(.) dan koma(,). Dalam artikel ini, kita akan menggunakan pemilih titik (.) dan memilih semua elemen dengan nama kelasnya menggunakan pemilih dan dipisahkan dengan koma (,).
"kelas" ialah atribut HTML yang menerima senarai kelas yang diasingkan ruang. Kelas ini boleh digunakan dalam CSS untuk menggayakan elemen tertentu, atau dalam javascript untuk memanipulasi elemen HTML ini.
Contoh 1
Dalam contoh ini, kami akan menggunakan warna fon "merah" pada elemen HTML yang mempunyai kelas "header" dan "para".
<!DOCTYPE html>
<html lang="en">
<head>
<title>How to apply styles to multiple classes at once?</title>
<style>
.header, .para {
color: red;
}
</style>
</head>
<body>
<h3 class="header">How to apply styles to multiple classes at once?</h3>
<p class="para">Lorem ipsum dolor sit amet consectetur adipisicing elit.</p>
</body>
</html>
Contoh 2
Dalam contoh ini, kami akan menggunakan warna fon pada "hijau" dan gaya fon kepada "italic" pada elemen HTML dengan nama kelas "header" dan "para". Kami akan menggunakan pemilih titik (.) dan menggabungkannya dengan koma (,) untuk mencapai ini.
<!DOCTYPE html>
<html lang="en">
<head>
<title>How to apply styles to multiple classes at once??</title>
<style>
.header, .para {
color: green;
font-style: italic;
}
</style>
</head>
<body>
<h3class="header">How to apply styles to multiple classes at once?</h3>
<p class="para">Lorem ipsum dolor sit amet consectetur adipisicing elit.</p>
</body>
</html>
Kesimpulan
Dalam artikel ini, kami mempelajari cara menggunakan berbilang kelas CSS serentak Kami melakukan ini dengan terlebih dahulu, memilih berbilang kelas sekaligus, menggunakan pemilih titik (.) yang disediakan oleh CSS, dan kemudian memberikan mereka gaya yang diperlukan dalam lembaran gaya. .
Atas ialah kandungan terperinci Bagaimana untuk menggunakan gaya pada berbilang kelas sekaligus?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!