CSS taustakuvat

CSS taustakuvat

background-image Ominaisuus määrittää elementin taustakuvaksi käytettävän kuvan.

Oletuksena kuva toistetaan, jotta se peittää koko elementin.

Esimerkki

Sivun taustakuvan voi asettaa tällä tavalla:

body {
  background-image: url("paper.gif");
}

Kokeile itse

Esimerkki

Tämä esimerkki näyttää tekstin ja taustakuvanVirheellinen yhdistelmäTeksti on vaikeaa lukea:

body {
  background-image: url("bgdesert.jpg");
}

Kokeile itse

Huomioitavaa:Kun käytetään taustakuvaa, käytä kuvia, jotka eivät häiritse tekstiä.

Voi myös asettaa taustakuvan tiettylle elementille, esimerkiksi <p> -elementille:

Esimerkki

p {
  background-image: url("paper.gif");
}

Kokeile itse