#html #css #image #sizing
#HTML #css #изображение #определение размера
Вопрос:
Я искал решения для этого требования и пока не нашел ни одного.
Я хотел бы отображать изображения размером 230 (ширина) x 390 (высота) на HTML-странице на нескольких мобильных устройствах, таких как iPhone 4/5, iPad 3/4 и устройства Android.
В настоящее время изображение выглядит слишком большим на iPhone4 и слишком маленьким на iPad3.
Как мне отобразить эти изображения в зависимости от размера экрана?
Ничего страшного, если это означает, что изображение будет растянуто на большом экране и не будет таким четким.
Комментарии:
1. есть несколько способов сделать это, во-первых, вы можете использовать css, зависящий от устройства / браузера, и вызывать их на основе возвращаемых значений. У вас также может быть ширина и высота в процентах от содержащего элемента. кроме того, взгляните сюда: developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries
2. спасибо, попробую!
Ответ №1:
Используя background-size:contain, фоновое изображение вашего div будет растягиваться, чтобы заполнить контейнер.
размер фона: содержит;
Ответ №2:
Поэтому, если вы хотите использовать медиа-запросы :
[1]: http://jsfiddle.net/5hTkf/
В примере нет обработки отображения на сетчатке, но вот статья об этом: Мультимедийные запросы Retina Display