CSS background Özelliği

background özelliği aşağıdaki background özelliklerinin kısa halde kullanımıdır.

background-color
background-image
background-position
background-size
background-repeat
background-origin
background-clip
background-attachment

Kullanılırken background özelliklerini sırasına göre tam şekilde yazmak zorunda değiliz yani background: #fff url(test.png) fixed; şeklinde bir kullanımda geçerli olacaktır.

Yapısı (Syntax)background: bg-color bg-image position/bg-size bg-repeat bg-origin bg-clip bg-attachment initial | inherit;

JavaScript Yapısı	object.style.background="red url(ataturk.jpg) top left no-repeat"
Animasyon Özellikleri Uygulanabilir	Evet (Daha fazla detay)

Değerler

Örnekler

Tüm özelliklerin bir arada kullanıldığı bir örneğe bakalım;

.box {
    width: 400px;
    height: 400px;
    padding: 25px;
    border: 6px dotted #222;
    background: yellow url(https://prototurk.com/public/img/logo.png) center no-repeat/450px content-box fixed;
}

Bazı özelliklerini bir arada kullanıldığı örnek ise;

.box {
    width: 200px;
    height: 100px;
    background: #fa6585 url(hello.gif) center;
}