Узнать, как создать полное фоновое изображение страницы используя HTML, CSS.
Изображение на всю страницу
Узнать, как создать фоновое изображение, которое покрывает все окно браузера. В следующем примере показано полноэкранное (и полуэкранное) адаптивное фоновое изображение:
Создать изображение на всю страницу
Используйте элемент контейнера и добавьте фоновое изображение в контейнер с помощью height: 100%.Совет: Используйте 50% для создания фонового изображения на полстраницы. Затем используйте следующие свойства фона, чтобы центрировать и масштабировать изображение идеально:
Примечание: Чтобы убедиться, что изображение занимает весь экран, необходимо также применить height: 100% как <html> и <body>:
body, html {
height: 100%;
}
.bg {
/* Используемое изображение */
background-image: url("img_girl.jpg");
/* Полный рост */
height: 100%;
/* Центр и масштабирование изображения */
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}Попробуйте сами »Половина страницы фонового изображения:
.bg {
height: 50%;
}Попробуйте сами »