Мне сложно изменить размер изображений, чтобы сделать их отзывчивыми.
Я разрабатываю приложение php для автоматического преобразования веб-сайта в отзывчивую версию. Я немного застрял на изображениях.
Я успешно добавил класс-оболочку к каждому изображению на веб-сайте и смог бы значительно изменить размер изображений.
Моя проблема связана с изображениями, которые, естественно, меньше окна, например логотипы и значки. Я не хочу изменять их размер.
Мой код в настоящее время преобразует:
<img src="[src]" />
в
<div class="erb-image-wrapper">
<img src="[src]" />
</div>
Где я использую следующий CSS:
.erb-image-wrapper{
max-width:90%;
height:auto;
position: relative;
display:block;
margin:0 auto;
}
.erb-image-wrapper img{
width:100% !important;
height:100% !important;
display:block;
}
Это изменяет размеры всех изображений, но я хочу, чтобы они изменяли размер изображений, расположенных по ширине страницы. Я могу достичь этого с помощью CSS?