turzifer

CSS ile tam ekran arka plan resimleri

CSS ile tam ekran arka plan resimleri yapmanın en kolay yolu, yüzde ve ekran bazlı (vh) birimleri kullanmak. Kopyalayıp yapıştırmak için hazır CSS kodu.

CSS ile tam ekran arka plan resimleri yapmanın en kolay yolu yüzde birimleri ile ekran tabanlı birimleri bir arada kullanmak.

.bg {
 position: relative;
 background: url('bg.jpg') center/cover;
 width: 100%;
 height: 100vh;
 }

Kaynak: https://bitsofco.de/viewport-vs-percentage-units/

vh (ekran yüksekliği) ve vw (ekran genişliği) birimleri ie8 üzeri tüm tarayıcılar tarafından destekleniyor.

caniuse.com'a göre viewport birimleri %80 oranında destekleniyor
caniuse.com’a göre viewport birimleri %80 oranında destekleniyor