3 простых и быстрых CSS техники для обрезания картинки

Техника 2 — использование свойства нарезки (Clip Property)

Оригинал

Оригинал для примера

Резанное изображение

Оригинал для примера

CSS

.crop{
  float:left;
  position:relative;
  width:200px;
  height:120px;
  border:1px solid #ccc;
  margin:.5em 10px .5em 0;
  }
.crop img{
  margin:0;
  position:absolute;
  top:-40px;
  left:-50px;
  clip:rect(40px 250px 160px 50px);
  }

Вернутся к статье | Вернутся на главную

Реклама