вопрос
Доброго времени суток. Возникла необходимость в обрезании картинок разного размера (например 580х350 и 290х420) до того который нужно получить в итоге (например что бы все картинки были 150х200). Помню видел в просторах интернета как то способ как можно сделать это при помощи css но увы найти не могу сейчас. Если кто может в этом помочь буду очень благодарен.
C помошью CSS можно пропорционально уменьшить и "спрятать выступающие излишки"
CSS:
Таким образом картинка всегда будет по центру вертикально и горизонтально.
Можно ещё убрать max-height: 200px; или max-width: 150px; в зависимости от потребнстей.
Но надо иметь в виду, что в IE7 придётся испоьзовать костыли, коих куча всяких.
<div class="img_wrap">
<img src="img.png" alt="" />
</div>
CSS:
.img_wrap {
width: 150px;
height: 200px;
overflow: hidden;
line-height: 185px;
text-align: center;
}
.img_wrap img {
max-height: 200px;
max-width: 150px;
vertical-align: middle;
}
Таким образом картинка всегда будет по центру вертикально и горизонтально.
Можно ещё убрать max-height: 200px; или max-width: 150px; в зависимости от потребнстей.
Но надо иметь в виду, что в IE7 придётся испоьзовать костыли, коих куча всяких.