Својство background-attachment

Својство background-attachment одређује на који начин се помера позадинска слика елемента: заједно са текстом или ће текст клизити по слици.

Синтакса

cssселектор {
  background-attachment: fixed | scroll | local;
}

Вредности

Вредност Опис
fixed Слика позадине ће бити непокретна, а текст ће клизити по њој.
scroll Слика позадине ће се померати заједно са текстом.
local Позадина се фиксира узимајући у обзир понашање елемента. Ако елемент има клизање, онда ће се позадина померати заједно са садржајем, али позадина која излази из оквира елемента остаје на месту.

Подразумевана вредност: scroll.

Пример . Вредност scroll

Сада је својство background-attachment подешено на вредност scroll. Померите елемент вертикално - видећете како се текст помера заједно са позадином:

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;
}

Результат:

Пример . Вредност fixed

А сада је својство background-attachment подешено на вредност fixed. Померите елемент вертикално - видећете како текст клизи по позадини:

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;
}

Результат:

Погледајте такође

  • својство background,
    које представља скраћеницу за позадину