1. background-color

    Menentukan warna latar belakang elemen. Bisa menggunakan nilai warna seperti nama warna, kode hex, RGB, atau HSL.

    background-color: #f0f0f0;

  2. background-image

    Menambahkan gambar sebagai latar belakang. Gunakan URL gambar dalam fungsi url():

    background-image: url('image.jpg');

  3. background-repeat

    Menentukan apakah gambar latar akan diulang:

    • repeat: gambar diulang di seluruh elemen
    • no-repeat: gambar ditampilkan sekali saja
    • repeat-x: gambar diulang hanya secara horizontal
    • repeat-y: gambar diulang hanya secara vertikal
    background-repeat: no-repeat;

  4. background-position

    Menentukan posisi gambar latar di dalam elemen. Posisi bisa diatur dengan kata kunci (seperti top, center, bottom) atau dengan nilai persentase/piksel.

    background-position: center;

  5. background-size

    Mengatur ukuran gambar latar:

    • cover: gambar menutupi seluruh elemen
    • contain: gambar menyesuaikan dengan elemen tanpa terpotong
    • Nilai khusus (misalnya 100px 200px) untuk menentukan lebar dan tinggi gambar
    background-size: cover;

  6. background-attachment

    Menentukan apakah background akan tetap atau bergulir dengan konten:

    • scroll: background bergerak saat pengguna menggulir halaman
    • fixed: background tetap di tempat
    • local: background bergulir hanya di dalam elemen konten
    background-attachment: fixed;

  7. background-blend-mode

    Mengontrol bagaimana warna atau gambar latar belakang berbaur (blend) satu sama lain jika ada lebih dari satu lapisan. Beberapa mode seperti multiply, screen, overlay, atau darken bisa digunakan untuk menciptakan efek visual.

    background-blend-mode: multiply;