Styl agtergrond Eiendom
Voorbeeld
Stileer die agtergrond van 'n dokument:
document.body.style.background = "#f3f3f3 url('img_tree.png') no-repeat right
top";
Meer "Probeer dit self" voorbeelde hieronder.
Definisie en gebruik
Die agtergrondeienskap stel of gee tot agt afsonderlike agtergrondeienskappe terug, in 'n snelskrifvorm.
Met hierdie eiendom kan jy een of meer van die volgende (in enige volgorde) stel/terugstuur:
- agtergrondkleur
- agtergrondprent
- agtergrond-herhaal
- agtergrond-aanhangsel
- agtergrondposisie
- agtergrond-grootte
- agtergrond-oorsprong
- agtergrond-snit
Die eienskappe hierbo kan ook gestel word met aparte styl eienskappe. Die gebruik van aparte eienskappe word sterk aanbeveel vir nie-gevorderde skrywers vir beter beheerbaarheid.
Blaaierondersteuning
Die nommers in die tabel spesifiseer die eerste blaaierweergawe wat die eiendom ten volle ondersteun.
| Property | |||||
|---|---|---|---|---|---|
| background | 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
Let wel: Sien individuele blaaierondersteuning vir elke waarde hieronder.
Sintaksis
Gee die agtergrondeienskap terug:
object.style.background
Stel die agtergrondeienskap:
object.style.background = "color image
repeat attachment position size origin clip|initial|inherit"
Eiendomswaardes
| 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 |
Tegniese besonderhede
| Standaard waarde: | deursigtige geen herhaal blaai 0% 0% outomatiese padding-boks grens-boks |
|---|---|
| Terugkeerwaarde: | 'n String, wat die agtergrond van 'n element voorstel |
| CSS weergawe | CSS1 + nuwe eiendomme in CSS3 |
Meer voorbeelde
Voorbeeld
Verander die agtergrond van 'n DIV-element:
document.getElementById("myDIV").style.background = "url('smiley.gif') blue repeat-x center";
Voorbeeld
Stel 'n agtergrondkleur vir 'n dokument:
document.body.style.backgroundColor = "red";
Voorbeeld
Stel 'n agtergrondprent vir 'n dokument:
document.body.style.backgroundImage = "url('img_tree.png')";
Voorbeeld
Stel 'n agtergrondprent om nie te herhaal nie:
document.body.style.backgroundRepeat = "repeat-y";
Voorbeeld
Stel die agtergrondprent om vas te stel (sal nie blaai nie):
document.body.style.backgroundAttachment = "fixed";
Voorbeeld
Verander die posisie van 'n agtergrondprent:
document.body.style.backgroundPosition = "top right";
Voorbeeld
Gee die agtergrondeienskapwaardes van 'n dokument terug:
document.body.style.background;
Verwante bladsye
CSS-tutoriaal: CSS-agtergrond
CSS3-tutoriaal: CSS3-agtergronde
CSS verwysing: agtergrond eiendom