Pengantar Selektor

Termasuk bagian Menata dengan CSS dalam perjalanan HTML di Coddy. Pelajaran 10 dari 76.

Dalam CSS, selector adalah pola yang digunakan untuk memilih elemen HTML yang ingin kamu beri gaya. Selector merupakan bagian penting dari aturan CSS karena menentukan elemen mana yang akan diberi gaya.

Ada berbagai jenis selector, masing-masing menargetkan elemen dengan cara yang berbeda. Memahami selector sangat penting untuk menguasai CSS dan membuat halaman web dengan gaya yang baik.

Berikut aturan CSS dasar dengan selector:

selector {
    property: value;
}

selector: Menargetkan elemen HTML yang akan diberi gaya.
property: Atribut gaya yang ingin kamu ubah (misalnya, color, font-size).
value: Nilai yang ingin kamu tetapkan untuk property (misalnya, blue, 16px).

Contohnya:

p {
    color: blue;
    font-size: 16px;
}

Dalam contoh ini, p adalah selector yang menargetkan semua elemen paragraf. Deklarasi mengatur warna teks menjadi biru dan ukuran font menjadi 16 piksel untuk semua paragraf.

Tantangan

Mudah

Kamu diberi dokumen HTML. Gunakan CSS internal untuk menata dokumen dengan properti berikut:

Atur warna latar belakang semua heading h1 menjadi green.
Atur warna teks semua heading h1 menjadi white.
Atur ukuran font semua paragraf (p) menjadi 18px.

Kamu diberi kode CSS awal untuk dokumen ini.

Coba sendiri

<!DOCTYPE html>
<html>
<head>
    <title>Selectors</title>
    <style>
        h1 {
            
        }
        p {
            
        }
    </style>
</head>
<body>
    <h1>John Doe</h1>
    <p>Web Developer</p>
</body>
</html>