CSS background-image egenskab

Definition og brug

background-image Egenskaben sætter et baggrundsbillede til elementet.

Elementets baggrund tager hele elementets størrelse, herunder indrykning og kant, men ikke margin.

Standardmæssigt er baggrundsbilledet placeret i elementets øverste venstre hjørne og gentages både horisontalt og vertikalt.

Tip:Indstil en tilgængelig baggrundsfarve, så websiden får en god visuel effekt, hvis baggrundsbilledet ikke er tilgængeligt.

Detaljeret forklaring

background-image egenskaben sætter et billede i elementets baggrund.

baseret på background-repeat egenskabsværdien, kan billedet gentages ubegrænset, langs en akse (x-akse eller y-akse) eller ikke gentages overhovedet.

Den oprindelige baggrundsbillede (originalbillede) baseres på background-position Placer værdien af egenskaben.

Se også:

CSS tutorial:CSS baggrund,CSS baggrund (avanceret),CSS gradient

HTML DOM reference manual:backgroundImage egenskaben

Eksempel

Sæt billedet som sidebaggrund:

body
  { 
  background-image: url(bgimage.gif);
  background-color: #000000;
  }

Prøv det selv

CSS syntaks

background-image: url|none|initial|inherit;

Egenskabsværdi

Egenskabsværdi

Værdi Beskrivelse
url('URL) Sti til billedet.
ingen Standardværdi. Viser ikke baggrundsbillede.
inherit Definerer, at baggrundsbilledets indstilling skal arves fra forældrelementet.

Tekniske detaljer

Standardværdi: ingen
Arv: nej
Version: CSS1
JavaScript syntaks: object.style.backgroundImage="url(stars.gif)"

Browserunderstøttelse

Tabelen indeholder nummeret på den første browserversion, der fuldt ud understøtter egenskaben.

Chrome Edge Firefox Safari Opera
Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 3.5