Lastnost background-attachment

Lastnost background-attachment določa, kako se drsi ozadjska slika elementa: skupaj z besedilom ali bo besedilo drselo po sliki.

Sintaksa

cssselektor {
  background-attachment: fixed | scroll | local;
}

Vrednosti

Vrednost	Opis
`fixed`	Slika ozadja bo negibna, besedilo pa bo drselo po njej.
`scroll`	Slika ozadja se bo drsala skupaj z besedilom.
`local`	Ozadje je fiksirano glede na obnašanje elementa. Če ima element drsenje, se bo ozadje drsalo skupaj z vsebino, vendar ozadje, ki preseže okvirje elementa, ostane na mestu.

Privzeta vrednost: scroll.

Primer . Vrednost scroll

Trenutno je lastnost background-attachment nastavljena na vrednost scroll. Drsnite element navpično - videli boste, kako se besedilo drsi skupaj z ozadjem:

html<body>
  <div id="elem">
    some long text
  </div>
</body>

cssbody {
  background-attachment: scroll;
  background-image: url("bg.png");
}

#elem {
  width: 400px;
  margin: 0 auto;
  text-align: justify;
  font-weight: bold;
  font-size: 20px;
}

Результат:

Primer . Vrednost fixed

Zdaj je lastnost background-attachment nastavljena na vrednost fixed. Drsnite element navpično - videli boste, kako besedilo drsi po ozadju:

html<body>
  <div id="elem">
    some long text
  </div>
</body>

cssbody {
  background-attachment: fixed;
  background-image: url("bg.png");
}

#elem {
  width: 400px;
  margin: 0 auto;
  text-align: justify;
  font-weight: bold;
  font-size: 20px;
}

Результат:

Glejte tudi

lastnost background,
ki je okrajšava za ozadje