如何将现有图像调整为“260x180”？
我目前正在使用 Carrierwave 和 Rmagick 将图像上传到我的 Amazon S3 存储桶，它会创建 2 个版本的图像：原始版本和拇指版本 (70x70)。
现在，我知道我可以创建另一个版本，以便创建三个版本，包括 260x180，但我觉得这会过度阻塞存储数据库，我想知道是否可以在视图上执行此操作等级。
我试过了
<%= image_tag(@syllabus.image_url, :size => "260x180") %>
但它似乎不起作用 - 图像大小不同。
另外，如果图像小于我想要的输出，我是否需要做一些与更大的图像不同的事情？例如，我需要将较大的剪掉，而将较小的展开，还是会自动缩放到所需的大小？
【问题讨论】：
标签： ruby-on-rails css image-processing
就像@Yosep 所说，这里没有什么神奇的轨道。 <%= image_tag %> 在结果 html 中生成 <img> 标记。如果您传递:size => '260x180'，则结果<img> 标记将其width 和height 设置为260 和180。
你的问题的答案来了。提供另一种图像尺寸的最佳方式是您一开始拒绝的方式。您需要在后端调整这些图像的大小并将它们存储在某个地方。
通过设置<img>标签的宽度和高度来调整图像大小不会保持图像的原始纵横比。如果原来的比例是260:180，那就没问题了。但如果不是，结果将是丑陋的。此外，这样做还有另一个缺点，这与您也不应该使用 CSS 调整图像大小的原因相同。在客户端将大图像调整为较小的图像最终会极大地浪费您的网络，这样做会减慢您网站的渲染速度。这是 YSlow 的规则之一。
要使用 CSS 调整图片大小，可以使用max-width 和max-height，较大的图片会相应调整大小，较小的图片不会调整大小。
【讨论】：
当看到你的代码时，Rails 所做的就是转向
<%= image_tag(@syllabus.image_url, :size => "260x180") %>
变成类似的东西
<image tag="image.jpg" width="260" height="190" ../>
在页面上 (HTML)。
也就是说，如果您的代码看起来无法正常工作，请尝试为其分配一个 CSS 类：
.image-size {
max-width: 300px;
max-height: 200px;
}
【讨论】：
如果您愿意，可以使用我们在云端自动调整图像大小。例如，以下命令将调整图像大小以填充 260x180 矩形。
<%= cl_image_tag("my_image.png", :size => "260x180", :crop => :fill) %>
此blog post 描述了如何使用 CarrierWave，同时所有图像都存储在云中，通过快速 CDN 交付，所有转换都在云中动态完成（无需安装 RMagick）。
【讨论】：
在视图中，不处理新图像？按照惯例，你会使用 CSS。
.image_container img {
width: 260px;
height: 180px
}
这里有一些有趣的 CSS 裁剪方法：http://cssglobe.com/post/6089/3-easy-and-fast-css-techniques-for-faux-image
【讨论】：