Задать вопрос
@Lorema
css

Как сверстать такую страницу?

b7bb030af7d2413fa1e26bf903c2d8a7.PNG При добавлении картинки через свойство background-image:url картинка отображается опираясь на свою изначальную высоту и ширину, а мне хотелось бы что бы она занимала всю страницу (в ширину естественно), и к тому же, как добавить текст внизу картинки? В данном примере использовал десятки <br>, как решить это по другому?
  • Вопрос задан
  • 267 просмотров
1 комментарий
Подписаться 2 Оценить 1 комментарий
Решения вопроса 3
julia_amake
@julia_amake
Front-end разработчик
если задать свойство background-size: cover, изображение будет масштабироваться под размеры блока.

десятки br не используйте, для позиционирования есть такие свойства, как margin (внешний отступ) и padding (внутренний), абсолютное позиционирование или псевдо-таблицы (display: table-cell; vertical-align: bottom;)
Ответ написан
5 комментариев
5 комментариев
hronik87
@hronik87
Обитаю в 1С-Bitrix
Если на картинке ничего нет, то можно не бэкграундом, а просто картинку запихать в блок. И прописать примерно такое:
div.block{
    width: 100%;
    height: auto;
}
div.block img{
    width: 100%;
    height: auto;
}
Ответ написан
Комментировать
Комментировать
@senselessV7
Может быть попробовать html, body и оберткам этого блока задать width: 100%, height: 100%
А для текста display: block чтобы друг под другом был (вместо br)
хотя не факт что понял вопрос)
Ответ написан
Комментировать
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript разработчик
вАйТи
от 5 000 до 25 000 ₽
Trainee - IT Support
move2usajobs.com LLC • Лос-Анджелес
от 2 000 до 4 000 $
React разработчик
Uptrade
от 150 000 до 200 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
8266 f12 требуется сделать ревью и оптимизировать работу
26 апр. 2024, в 20:42
2000 руб./за проект
Доработать и интегрировать модуль на WordPress
26 апр. 2024, в 19:53
5000 руб./за проект
Разработать Telegram mini app
15 апр. 2024, в 22:14
30000 руб./за проект
Ещё заказы