Свойство background-attachment

Свойство background-attachment элементнинг фон расмини қандай усулда прокрутка қилишни белгилайди: матн билан бирга ёки матн расм устида силжийди.

Синтаксис

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

Қийматлар

Қиймат	Тасвир
`fixed`	Фон расми ҳаракатсиз бўлади, матн эса унинг устида силжийди.
`scroll`	Фон расми матн билан бирга прокрутка бўлади.
`local`	Фон элементнинг ҳат-ҳаракатини ҳисобга олган ҳолда мустаҳкамланади. Агар элементда прокрутка бўлса, фон ишора билан бирга прокрутка бўлади, лекин элемент чекларидан ташқаридаги фон ўрнида қолади.

Стандарт қиймат: scroll.

Мисол . Scroll қиймати

Ҳозир background-attachment свойствоcи 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 свойствоcи 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 свойствоcи,
фон учун қисқартирилган свойство сифатида