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 қасиеті,
    фон үшін қысқартылған қасиет ретінде