Postingan lainnya
Kelas Premium!
Belajar bikin website dari nol sekarang
Gunakan kupon "lebihcepat" untuk diskon 25%!
Cara membuat Background Image Full Screen di web
Agan-agan, mau tanya, cara supaya gambar di Background Tag Body HTML full screen gimana yaa gan. Ini Code yang saya buat, apa yang perlu di tambah?
body{
background-color: black;
background-image: url('bg.png');
background-repeat: no-repeat;
background-attachment :fixed;
background-size: contain;
background-position: center;
}
Terima Kasih.
Tanggapan
ukuran gambar paling kurang harus sama dengan ukuran background yang di inginkan
3 Jawaban:
<div>Perlu di tambahkan property height dan nilainya harus 100vh<br><br></div><pre>body{
height: 100vh;
background-color: black;
background-image: url('bg.png');
background-repeat: no-repeat;
background-attachment :fixed;
background-size: contain;
background-position: center;
}</pre>
Tanggapan
ga bisa om, gambar masih blm full screen.
cek lokasinya filenya
<div>ukuran gambar (height) udah di setting dari 100px, 200px, sampai 1000px. tapi ukuran gambar tetep tidak berubah, hanya ukuran layar yang berubah.<br><br>cek lokasi gambar udah aman kok, </div>
Jawaban Terpilih
<div>coba ganti background-size jadi cover<br>lebih baik lagi kalau yang di-style html tag-nya; karena ukuran height-nya mendekati window browser-nya.<br><br></div><pre>html { background: url(bg.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }</pre>
Tanggapan
Ini jawaban terbaik, makasih om, udah terjawab