Properti background-image CSS

Definisi dan penggunaan

background-image Properti menetapkan gambar latar belakang untuk elemen.

Latar belakang elemen mengambil seluruh ukuran elemen, termasuk jarak putar dan garis batas, tetapi tidak termasuk jarak ekor.

Secara default, gambar latar belakang berada di pojok kiri atas elemen dan diulang secara horizontal dan vertikal.

Petunjuk:Atur warna latar belakang yang tersedia, begitu latar belakang gambar tidak tersedia, halaman masih dapat mendapatkan efek visual yang bagus.

Keterangan detil

Properti background-image akan menetapkan gambar di latar belakang elemen.

Berdasarkan background-repeat nilai properti, gambar dapat diutuhkan secara tak terbatas, diutuhkan sepanjang sumbu (sumbu x atau sumbu y), atau sama sekali tidak diutuhkan.

Gambar latar belakang asli (gambar asli) berdasarkan background-position Tempat penempatan nilai properti.

Lihat pula:

Panduan CSS:Latar belakang CSS、Latar belakang CSS (lanjutan)、Graiyan CSS

Panduan referensi HTML DOM:Properti backgroundImage

Contoh

Atur gambar sebagai latar belakang halaman:

body
  { 
  background-image: url(bgimage.gif);
  background-color: #000000;
  }

Coba sendiri

Syntaks CSS

background-image: url|none|initial|inherit;

Nilai properti

Nilai properti

Nilai Deskripsi
url('URL') Jalur ke gambar.
none Nilai default. Tidak menampilkan gambar latar belakang.
inherit Diatur untuk menerima pengaturan properti background-image dari elemen induk.

Detil teknis

Nilai default: none
Inheritance: no
Versi: CSS1
Syntaks JavaScript: object.style.backgroundImage="url(stars.gif)"

Dukungan browser

Tabel angka menunjukkan versi pertama browser yang mendukung properti ini penuh.

Chrome Edge Firefox Safari Opera
Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 3.5