CSS background-image egenskap

Definition och användning

background-image Egenskapen sätter bakgrundsbild till elementet.

Elementets bakgrund täcker elementets hela storlek, inklusive inre marginaler och ramar, men inte yttre marginaler.

Som standard är bakgrundsbilden placerad i elementets övre vänstra hörn och upprepas horisontellt och vertikalt.

Tips:Ange en tillgänglig bakgrundsfärg, så att sidan fortfarande får en bra visuell effekt om bakgrundsbilden inte är tillgänglig.

Detaljerad förklaring

background-image egenskapen sätter en bild i elementets bakgrund.

enligt background-repeat egenskapens värde, kan bilden铺streckas oändligt, längs en axel (x-axel eller y-axel) eller inte铺streckas alls.

Initial bakgrundsbild (ursprunglig bild) baserat på background-position Placering av egenskapens värde.

Se också:

CSS kurs:CSS bakgrund,CSS bakgrund (avancerad),CSS gradient

HTML DOM referenshandbok:backgroundImage egenskapen

Exempel

Sätt in bilden som sidans bakgrund:

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

Prova själv

CSS-syntax

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

Egenskapsvärde

Egenskapsvärde

Värde Beskrivning
url('URL) Sökväg till bilden.
ingen Standardvärde. Visa inte bakgrundsbild.
inherit Det specificeras att inställningen för background-image egenskapen bör härledas från föräldrelementet.

Tekniska detaljer

Standardvärde: ingen
Arvbarhet: nej
Version: CSS1
JavaScript-syntax: object.style.backgroundImage="url(stars.gif)"

Webbläsarstöd

Tabellen siffror anger den första webbläsarversion som fullständigt stöder egenskapen.

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