Перейти к содержимому

Форум ZiSMO.biz


Купить ссылку здесь
Фотография

Помощь с картинко на сайте

Форум ZiSMO.biz
5
Сообщений в теме: 5

OFFLINE Отправлено

GreatestMaks
Активный
  • Онлайн:44д 11ч 26м
15

Есть адаптация картинки под размер экрана на сайте. Реализована она на данный момент так:
 

.img {
    max-width:100%;
    height: auto;
}

При больших размерах экрана (ПК) все выглядит хорошо. 

При низких разрешениях экрана (мобильный телефон, 320 на 240 px) картинку увеличивает БОЛЬШЕ своего собственного размера. Например, если картинка 100 px по ширине, ее растянет на 320 px по ширине, искажая качество.

Надо сделать так, чтобы картинка не увеличивалась больше своего собственного физического размера.Как можно исправить?


    • 0
  • Наверх

Поделиться этим:

OFFLINE Отправлено

Коля Петрик
Пользователи
  • Онлайн:9ч 28м
1
Используй media query css
 
Пример:
 
@media (max-width: макс.размер) {
 
//CSS  
 
}

    • 0
  • Наверх

OFFLINE Отправлено

Arsaman
Постоянный
  • Онлайн:30д 6ч 23м
26

Скинь сайт - посмотрим.


    • 0
  • Наверх

Рекламный пост

OFFLINE Отправлено

Pleorin
VIP
  • Онлайн:16д 18ч 51м
61

*
Популярное сообщение!

1)  sms-online.pro - новый, динамически развивающийся, сайт по SMS активациям почти любого сервиса!

Наш сервис полностью автоматизирован
Мы можем похвастаться не только высокой скоростью работы сайта, но и скоростью предоставления SMS сообщений.

Большой выбор стран!

0857741a94ee60ff651ae6730881f767.gif

 

Канал в Telegram:@smsonlinepro
Поддержка в Telegram: @Pleorin
Почта: support@sms-online.pro

 

2) opt-vk.ru - наш магазин АККАУНТОВ и ПРOКСИ по оптовым ценам

Индивидуальные предложения каждому!

Канал в Telegram@optvkru


Сообщение отредактировал Pleorin: 01 07 2019 - 10:34

http://sms-online.pro  - Лучший сайт по приему SMS от любого сервиса!  http://opt-vk.ru - Аккаунты VK.COM ПРOКСИ по оптовой ЦЕНЕ

    • 25
  • Наверх

OFFLINE Отправлено

siteMaster
Активный
  • Онлайн:5ч 25м
1

Попробуй не max-width:100%, a просто width:100%


Сообщение отредактировал siteMaster: 26 07 2019 - 09:13

    • 0
  • Наверх

OFFLINE Отправлено

Ign.
Активный
  • Онлайн:1д 14ч 35м
4

Конкретики немного, поэтому я так понял из комментариев, если проблема не решена, то для широкоформатных адаптивных изображений пробуйте так ( скопировано):
.container {

width: 100%;
}
img {
width: 100%;
}


Сообщение отредактировал Ign.: 02 08 2019 - 15:54

    • 0
  • Наверх

OFFLINE Отправлено

Kandi
Активный
  • Онлайн:2д 19ч 31м
3

Есть адаптация картинки под размер экрана на сайте. Реализована она на данный момент так:
 

.img {
    max-width:100%;
    height: auto;
}

При больших размерах экрана (ПК) все выглядит хорошо. 

При низких разрешениях экрана (мобильный телефон, 320 на 240 px) картинку увеличивает БОЛЬШЕ своего собственного размера. Например, если картинка 100 px по ширине, ее растянет на 320 px по ширине, искажая качество.

Надо сделать так, чтобы картинка не увеличивалась больше своего собственного физического размера.Как можно исправить?

 

Всё зависит от контейнера в котором находится картинка, но добавьте width: 100% или windth: inherit, должно помочь. Если не поможет, киньте ссылку на сайт и прикрепите скриншот с примером ошибки.

Если тяжелый случай и кривой CSS, возможно надо использовать медиазапросы.


    • 0
  • Наверх