CSS background-size Özelliği

CSS3 background-size

Css background-size özelliği arka plana eklenen resimlerin boyutlarını kontrol etmek için kullanılır.

Örnek:

Bu örnekte, arka plan olarak eklenecek resmin boyutlarını background-size özelliği ile boyutlandırılacaktır.

body { background: url("html.png"); background-size: 80px 80px; background-repeat: no-repeat; }

CSS3 background-size nedir nasıl kullanılır

Css background özelliği özelliği:Arka plan olarak kullanılacak resmin boyutlarını değiştirmek için kullanılır.

CSS background-size	CSS background-size özellikleri
Varsayılan Değer:	auto
Kalıtsallık:	yok
Animasyon Özelliği:	var
Versiyon:	CSS3
JavaScript background-size:	object.style.backgroundSize="60px 120px"

CSS3 background-size Tarayıcı Desteği

CSS Kodu:
background-size	4.0 1.0 -webkit-	4.0 3.6 -moz-	4.0 3.6 -moz-	4.1 3.0 -webkit-	10.5 10.0 -o-

CSS3 background-size Değerleri

background-size:auto|length|cover|contain|initial|inherit;

CSS3 background-size özelliği değerleri

CSS background-size değerleri	CSS background-size değerleri tanımları	CSS Örnek Uygulamalar
auto	Varsayılan değerdir resim gerçek boyutlarındadır.
length	Resmin genişlik ve yüksekliğinin belirtildiği değerdir.Sırasıyla ilk yazılan genişlik ikincisi ise yüksekliktir. Eğer tek bir değer girilirse ikinci değer varsayılan olarak auto değeri alacaktır.
percentage	Resmin genişlik ve yüksekliğinin % olarak belirtildiği değerdir.Sırasıyla ilk yazılan genişlik ikincisi ise yüksekliktir. Eğer tek bir değer girilirse ikinci değer varsayılan olarak auto değeri alacaktır.
cover	Ölçekli olacak şekilde resim ait oldugu html elemanını kaplayacak şekilde büyüyecektir. Fakat resmin bir kısmı görünmeme ihtimali vardır.
contain	Resim içinde bulunduğu kapsayıcının içinde, ölçekli olarak sığabildiği ölçüde ekranı kaplar.
initial	Özelliğin varsayılan değeridir.
inherit	Soybağından alınan değeri alır.