Pengumpulan CSS dan pemilih bersarang

Pemilih Berkumpulan dan Bersarang CSS


Pemilih Dikumpulkan

Di sana adalah banyak elemen dengan gaya yang sama dalam helaian gaya, Untuk meminimumkan kod, anda boleh menggunakan pemilih kumpulan. Pisahkan setiap pemilih dengan koma.

Instance

       <!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>php中文网(php.cn)</title>
    <style>
        h1,h2,p
        {
            color:green;
        }
    </style>
</head>

<body>
<h1> PHP中文网你</h1>
<h2>php.cn</h2>
<p>学习PHP知识的好选择.</p>
</body>
</html>

Jalankan program dan cuba


Pemilih Bersarang

Ia mungkin terpakai pada penggayaan pemilih dalam pemilih .

Dalam contoh berikut, tiga gaya ditetapkan:

Tentukan gaya untuk semua elemen p >

      <!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>php中文网(php.cn)</title>
    <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>请不要失望,平凡是为了最美的荡气回肠。</p>
</body>
</html>

Jalankan program untuk mencubanya




Meneruskan pembelajaran
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> <style> h1,h2,p { color: #d4d223; } </style> </head> <body> <h1>PHP中文网</h1> <h2>php.cn</h2> <p>你学习PHP知识的好选择.</p> </body> </html>
  • Cadangan kursus
  • Muat turun perisian kursus