Pengumpulan CSS...LOGIN

Pengumpulan CSS dan pemilih bersarang

Penghimpunan CSS dan pemilih bersarang

Pemilih perkumpulan yang dipanggil bermakna apabila elemen yang sepadan dengan berbilang pemilih memerlukan gaya yang sama, berbilang pemilih boleh dipisahkan dengan koma dan diletakkan di hadapan pernyataan gaya. Mencapai kesan yang sama bagi berbilang pemilih dan pengisytiharan gaya berbilang

Apa yang dipanggil pemilih bersarang adalah untuk menetapkan gaya elemen yang sepadan dengan pemilih di dalam pemilih

dalam gaya Terdapat banyak elemen dengan gaya yang sama dalam jadual.

h1{color:green;}
h2{color:green;}
p{color:green;}

Untuk meminimumkan kod, anda boleh menggunakan pemilih berkumpulan.
Setiap pemilih dipisahkan dengan koma
Dalam contoh di bawah, kami menggunakan pemilih berkumpulan untuk kod di atas:

h1,h2,p{color:green;}

Pemilih bersarang

Ia. boleh digunakan pada gaya pemilih di dalam pemilih.
Dalam contoh berikut, tiga gaya ditetapkan:

Nyatakan gaya untuk semua elemen p

Tentukan gaya untuk semua elemen dengan class="marked"

Tentukan gaya untuk semua elemen p dalam elemen class="marked"

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
p{  
  color:blue;    text-align:center;}
.marked{    background-color:red;}
.marked p{    color:white;}
</style>
</head>
<body>
<p>这个段落是蓝色文本,居中对齐。</p>
<div class="marked">
<p>这个段落不是蓝色文本。</p>
</div>
<p>所有 class="marked"元素内的 p 元素指定一个样式,但有不同的文本颜色。</p>
</body>
</html>


bahagian seterusnya
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style> p{ color:blue; text-align:center;} .marked{ background-color:red;} .marked p{ color:white;} </style> </head> <body> <p>这个段落是蓝色文本,居中对齐。</p> <div class="marked"> <p>这个段落不是蓝色文本。</p> </div> <p>所有 class="marked"元素内的 p 元素指定一个样式,但有不同的文本颜色。</p> </body> </html>
babperisian kursus