Мне сложно изменить размер изображений, чтобы сделать их отзывчивыми.
Я разрабатываю приложение 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?