CSS háttér tulajdonságok - CSS background properties

Megnevezés Leírás
background-color Az elem háttérszínének megadási lehetősége
Értéke lehet:
  a szín neve, például "yellow"
  egy RGB érték, például "rgb(255,0,0)"
  egy hexadecimális érték, például "#ff0000"
Példák:
  body {background-color: yellow;}
  p {background-color: rgb(255,0,0};}
  div {background-color: #ff0000;}
background-image Kép használata az elem hátterén
Példák:
  body {background-image: url('cssbyla.jpg');}
background-repeat A háttérkép ismétlésének beállítása
Értéke lehet:
  repeat - a kép ismétlése mindkét irányba
  repeat-x - a kép ismétlése vízszintesen
  repeat-y - a kép ismétlése függőlegesen
  no-repeat - nincs ismétlés
  inherit - a szülő elemtől örökli az ismétlést
Alapértelmezett: repeat
Példák:
  body
  {
    background-image: url('cssbyla.jpg');
    background-repeat: repeat-y;
  }
background-attachment Háttérkép helyzetének beállítása
Értéke lehet:
  fixed - a kép a képernyő görgetésekor is a helyén marad
  scroll - a kép a képernyő görgetésekor együtt mozog a tartalommal
  inherit - a szülő elemtől örökli az ismétlést
Alapértelmezett: scroll
Példák:
  body
  {
     background-image: url('cssbyla.jpg');
     background-repeat: no-repeat;
     background-attachment: scroll;
  }
background-position A kép poziciójának beállítása
Lehetőségek:
  left top - balra fenn
  left center - balra középen
  left bottom - balra lenn
  right top - jobbra fenn
  right center - jobbra középen
  right bottom - jobbra lenn
  center top - középen fenn
  center center - középen középen
  center bottom - középen lenn
  x% y% - vízszintes% függőleges% A bal felső sarok a 0% 0%. A jobb alsó sarok a 100% 100%. Ha csak az első értéket adjuk meg, a második 50% lesz.
  xpos ypos - vízszintes pozició függőleges pozició A bal felső sarok értéke 0 0. Használhatod a pixelt is (0px 0px) vagy a további szabványos CSS egységeket is. Ha csak egy értéket adsz meg, a második 50% lesz.
  inherit - a szülő elemtől örökli az értékét
Alapértelmezett: 0% 0%
Példák:
  body
  {
     background-image:url('cssbyla.jpg');
     background-repeat:no-repeat;
     background-position:right top;
  }
background Összetett, egysoros megadási lehetőség (shorthand property)
Példák:
  body{ background:#ff0000 url('cssbyla.jpg') no-repeat left top;}
ugrás a lap tetejére