Stil arka planı Özellik
Örnek
Bir belgenin arka planına stil verin:
document.body.style.background = "#f3f3f3 url('img_tree.png') no-repeat right
top";
Aşağıda daha fazla "Kendiniz Deneyin" örnekleri.
Tanım ve Kullanım
Arka plan özelliği, bir steno biçiminde sekiz adede kadar ayrı arka plan özelliğini ayarlar veya döndürür.
Bu özellik ile aşağıdakilerden birini veya birkaçını (herhangi bir sırayla) ayarlayabilir/döndürebilirsiniz:
- arka plan rengi
- arka plan görüntüsü
- arka plan-tekrar
- arka plan eki
- arka plan konumu
- arka plan boyutu
- arka plan kökenli
- arka plan klibi
Yukarıdaki özellikler, ayrı stil özellikleriyle de ayarlanabilir. Daha iyi kontrol edilebilirlik için ileri düzeyde olmayan yazarlar için ayrı özelliklerin kullanılması şiddetle tavsiye edilir.
Tarayıcı Desteği
Tablodaki sayılar, özelliği tam olarak destekleyen ilk tarayıcı sürümünü belirtir.
Property | |||||
---|---|---|---|---|---|
background | 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
Not: Aşağıdaki her bir değer için ayrı tarayıcı desteğine bakın.
Sözdizimi
arka plan özelliğini döndürün:
object.style.background
Arka plan özelliğini ayarlayın:
object.style.background = "color image
repeat attachment position size origin clip|initial|inherit"
Mülk değerleri
Value | Description |
---|---|
color | Sets the background color of an element |
image | Sets the background image for an element |
repeat | Sets how a background image will be repeated |
attachment | Sets whether a background image is fixed or scrolls with the page |
position | Sets the starting position of a background image |
size | Sets the size of a background image |
origin | Sets the background positioning area |
clip | Sets the painting area of a background image |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
Teknik detaylar
Varsayılan değer: | şeffaf yok tekrar kaydırma %0 %0 otomatik dolgu kutusu kenarlık kutusu |
---|---|
Geri dönüş değeri: | Bir öğenin arka planını temsil eden bir Dize |
CSS Sürümü | CSS1 + CSS3'teki yeni özellikler |
Daha fazla örnek
Örnek
Bir DIV öğesinin arka planını değiştirin:
document.getElementById("myDIV").style.background = "url('smiley.gif') blue repeat-x center";
Örnek
Bir belge için bir arka plan rengi ayarlayın:
document.body.style.backgroundColor = "red";
Örnek
Bir belge için bir arka plan resmi ayarlayın:
document.body.style.backgroundImage = "url('img_tree.png')";
Örnek
Bir arka plan görüntüsünü tekrar etmeyecek şekilde ayarlayın:
document.body.style.backgroundRepeat = "repeat-y";
Örnek
Sabitlenecek arka plan görüntüsünü ayarlayın (kaydırılmayacak):
document.body.style.backgroundAttachment = "fixed";
Örnek
Bir arka plan görüntüsünün konumunu değiştirin:
document.body.style.backgroundPosition = "top right";
Örnek
Bir belgenin arka plan özellik değerlerini döndürün:
document.body.style.background;
İlgili Sayfalar
CSS eğitimi: CSS Arka Planı
CSS3 eğitimi: CSS3 Arka Planları
CSS referansı: arka plan özelliği