Меню
×
   ❮     
HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP КАК СДЕЛАТЬ SW3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY EXCEL XML DJANGO NUMPY PANDAS NODEJS R TYPESCRIPT ANGULAR GIT POSTGRESQL MONGODB ASP AI GO KOTLIN SASS VUE DSA GEN AI SCIPY AWS КИБЕРБЕЗОПАСНОСТЬ НАУКА О ДАННЫХ
     ❯   

CSS Справочники


CSS Свойства





background-attachment



Пример

Фоновое изображение, которое не будет прокручиваться вместе со страницей (исправлено):

body {
  background-image: url("img_tree.gif");
  background-repeat: no-repeat;
  background-attachment: fixed;
}
Попробуйте сами »

Определение background-attachment

CSS свойство background-attachment определяет, будет ли фоновое изображение прокручиваться вместе с остальной частью страницы или будет фиксированным.

Значение по умолчанию: scroll
Унаследовано: no
Анимируемый: no. Читайте о animatable
Версия: CSS1
JavaScript синтаксис: object.style.backgroundAttachment="fixed" Попробуй

Поддержка background-attachment

Цифры в таблице указывают первую версию браузера, которая полностью поддерживает это свойство.

Свойство
background-attachment 1.0 4.0 1.0 1.0 3.5


Синтаксис background-attachment

background-attachment: scroll|fixed|local|initial|inherit;

Значения background-attachment

Значение Описание
scroll Фоновое изображение будет прокручиваться вместе со страницей. Это значение по умолчанию
fixed Фоновое изображение не будет прокручиваться вместе со страницей
local Фоновое изображение будет прокручиваться вместе с содержимым элемента
initial Устанавливает для этого свойства значение по умолчанию. Читайте о initial
inherit Наследует это свойство от своего родительского элемента. Читайте о inherit

Примеры background-attachment

Пример

Фоновое изображение, которое будет прокручиваться вместе со страницей (scroll). Это значение по умолчанию:

body {
  background-image: url("img_tree.gif");
  background-repeat: no-repeat;
  background-attachment: scroll;
}
Попробуйте сами »
Пример

Как создать простой эффект параллаксной прокрутки (создать иллюзию трехмерной глубины):

.fixed-bg {
    /* Фоновое изображение */
    background-image: url("img_tree.gif");
    /* Установите заданную высоту или минимальную высоту для фонового изображения */
    min-height: 500px;
    /* Установите фоновое изображение на фиксированное (не прокручивайте вместе со страницей) */
    background-attachment: fixed;
    /* Центр фонового изображения */
    background-position: center;
    /* Установите фоновое изображение на нет повторять */
    background-repeat: no-repeat;
    /* Масштабируйте фоновое изображение так, чтобы оно было как можно больше */
    background-size: cover;
}
Попробуйте сами »

Страницы по теме background-attachment

CSS Учебник: CSS Background

HTML DOM справочник: backgroundAttachment свойство



×

Связаться с отделом продаж

Если вы хотите использовать услуги schoolsw3 как образовательное учреждение, команда или предприятие, отправьте нам электронное письмо:
sales@schoolsw3.com

Сообщить об ошибке

Если вы хотите сообщить об ошибке или внести предложение, отправьте нам электронное письмо:
help@schoolsw3.com

Schoolsw3 оптимизирован для обучения и подготовки. Примеры могут быть упрощены для улучшения чтения и обучения. Учебники, ссылки и примеры постоянно проверяются, чтобы избежать ошибок, но мы не можем гарантировать полную правильность всего контента.
При использовании Schoolsw3 вы соглашаетесь прочитать и принять наши условия использования,
политику использования файлов cookie и конфиденциальности.

Авторское право 1999- принадлежит Refsnes Data. Все права защищены. Schoolsw3 работает на SW3.CSS.