Здравствуйте, уважаемые, появилась следующая задача: растянуть содержимое div блока на всю высоту экрана, иными словами — Если у пользователя широкий экран, то всё содержимое блока < div > растягивается по всей ширине его экрана. Если у пользователя узкий экран, то всё содержимое блока < div > сжимается, так, чтобы не вылезать за пределы экрана.
Правда-правда...
Ответ
Сделайте следующее:
Немедленно избавьтесь от тегов font, вместо них используйте span, p, div и т.д.
Стили пишите в отдельном CSS файле, или, на худой конец, в head
В стилях для body, html пропишите:
body, html {
width: 100%;
height: 100%;
}
В стилях для div
.div {
min-width: 100%;
min-height: 100%;
position: relative;
}
В стилях для img:
.div img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
Хотя, на мой взгляд, картинку лучше задать background'ом для .div и прописать для него background-size: cover;
Надписи так же позиционируются абсолютно.
P.S. А вообще, почитайте лучше по адаптивной верстке, например здесь. А также, и это главное, очень внимательно читайте и я бы даже сказал учите html & css - думаю, что вот этот ресурс Вам подойдет.
Комментариев нет:
Отправить комментарий