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

Техника 2 — использование абсолютного позиционирования (Absolute Positioning)

Оригинал

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

CSS

.crop{
  float:left;
  margin:.5em 10px .5em 0;
  overflow:hidden; /* this is important */
  position:relative; /* this is important too */
  border:1px solid #ccc;
  width:200px;
  height:120px;
  }
.crop img{
  position:absolute;
  top:-40px;
  left:-50px;
  }

Реклама