Задать вопрос
@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)
хотя не факт что понял вопрос)
Ответ написан
Комментировать
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

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

Похожие вопросы
Вакансии с Хабр Карьеры
Fullstack Developer под Wordpress
Future Search
от 90 000 до 150 000 ₽
Верстальщик HTML
MST
от 450 $
JavaScript FullStack разработчик
Rocket • Смоленск
от 80 000 до 130 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Сделать запись в файл на ubuntu
27 дек. 2024, в 03:33
1500 руб./за проект
Сделать анимацию и отрисовать иллюстрации
27 дек. 2024, в 02:41
50000 руб./за проект
Нарисовать арты
26 дек. 2024, в 23:03
500 руб./в час
Ещё заказы