css - 如何裁剪图像以使其大小相同

Question

我有一个图片库，希望所有图片的大小都相同。这是我的 CSS。我正在关注这个 tutorial .

div.gallery {
  border: 1px solid #ccc;
}

div.gallery:hover {
  border: 1px solid #777;
}

div.gallery img {
  width: 100%;
  height: auto;
}

div.desc {
  padding: 15px;
  text-align: center;
}

* {
  box-sizing: border-box;
}

.responsive {
  padding: 0 6px;
  float: left;
  width: 24.99999%;
}

@media only screen and (max-width: 350px) {
  .responsive {
    width: 45.99999%;
    margin: 6px 0;
  }
}

@media only screen and (max-width: 250px) {
  .responsive {
    width: 25%;
  }
}

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

这是问题的直观表示。例如，我想裁剪火箭。

Answer 1

看看 ImageResizer.net。它拥有您需要的一切，包括用于 SQL Server 集成和裁剪并保留纵横比的代码示例:

http://imageresizing.net/

最受欢迎的功能是免费和开源的:

Resizing, cropping, rotating, flipping
Borders, drop-shadows, padding, background colors
Adjustable Jpeg compression. Multi-page tiff viewing
Animated GIF frame selection. Comprehensive, real-time diagnostics
Basic GIF and PNG encoding
Gradient generation