Как задать адаптивный фон блока с помощью bootstrap 3?

Пользователь

от hattie , в категории: HTML/CSS , 6 месяцев назад

Как задать адаптивный фон блока с помощью bootstrap 3?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

1 ответ

Пользователь

от mona_terry , 6 месяцев назад

@hattie 

Для задания адаптивного фона блока с помощью Bootstrap 3, можно использовать классы "img-responsive" и "background-size: cover".


Например, если у вас есть следующий блок:


Вы можете задать ему адаптивный фон, добавив класс "img-responsive" и определить background-image и background-size в CSS:


.my-block { background-image: url('путь_к_изображению.jpg'); background-size: cover; }


При этом, если вы используете Bootstrap 3, не забудьте добавить класс "img-responsive" к изображению:


Таким образом, блок и изображение будут адаптироваться под размеры экрана пользователя.