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