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

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

b7bb030af7d2413fa1e26bf903c2d8a7.PNG При добавлении картинки через свойство background-image:url картинка отображается опираясь на свою изначальную высоту и ширину, а мне хотелось бы что бы она занимала всю страницу (в ширину естественно), и к тому же, как добавить текст внизу картинки? В данном примере использовал десятки <br>, как решить это по другому?
  • Вопрос задан
  • 271 просмотр
Подписаться 2 Оценить 1 комментарий
Помогут разобраться в теме Все курсы
  • Нетология
    Веб-разработчик с нуля: профессия с выбором специализации
    14 месяцев
    Далее
  • Академия Эдюсон
    Frontend-разработчик: тариф PRO
    10 месяцев
    Далее
  • ProductStar × РБК
    Профессия: Инженер по тестированию
    6 месяцев
    Далее
Решения вопроса 3
julia_amake
@julia_amake
Front-end разработчик
если задать свойство background-size: cover, изображение будет масштабироваться под размеры блока.

десятки br не используйте, для позиционирования есть такие свойства, как margin (внешний отступ) и padding (внутренний), абсолютное позиционирование или псевдо-таблицы (display: table-cell; vertical-align: bottom;)
Ответ написан
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)
хотя не факт что понял вопрос)
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

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

Похожие вопросы