Быстрый совет о том, как добавить полноэкранное фоновое изображение только с HTML и CSS, JavaScript не требуется. Этот метод отлично работает с адаптивными веб-сайтами и различными пропорциями.
Добавьте изображение в начало вашего HTML-документа после открывающего тега , назначив ему класс bg .
Код
<img src="filename.jpg" alt="bckgound" class="bg" />
Заполните файл CSS с помощью класса .bg. Мы можем добавить отзывчивую точку разрыва в 1024 пикселей.
Код
img.bg {
min-height: 100%;
min-width: 1024px;
width: 100%;
height: auto;
position: fixed;
top: 0;
left: 0;
}
@media screen and (max-width: 1024px){
img.bg {
left: 50%;
margin-left: -512px; }
}
Фоновое изображение займет весь экран, выдвигая содержимое ниже на странице. Обязательно настройте содержимое ниже, расположив его над фоновым изображением.
