Bagaimana untuk menggunakan gaya pada berbilang kelas sekaligus?-tutorial css-php.cn

Bagaimana untuk menggunakan gaya pada berbilang kelas sekaligus?

王林

Lepaskan： 2023-08-19 09:33:16

ke hadapan

1044 orang telah melayarinya

How to apply styles to multiple classes at once?

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>

Salin selepas log masuk

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>

Salin selepas log masuk

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!