作物所需方面的圖像，然後調整其大小

裁剪到所需的高寬比的圖像（可以說2:1）
然後讓其自動調整大小以適應一個盒子。

我想剪裁，因爲我有很多固定比例（2：1）的盒子（div）。如果我沒有裁剪到所需的縱橫比，那麼圖像會擴大或縮小以適應盒子。這個問題的另一種解決方法是信箱裝箱圖像，我再也不想要了。

有人可以指出一個解決方案。

例如：如果圖像是100px X 100px，我首先要將它裁剪爲66px X 33 px，然後允許它展開，收縮以適合我的箱子，所有箱子都是2：1。

2016-02-20 Sachin

如果不從字面上需要將文件改寫到一個不同的大小，可以有效地掩蓋圖像與CSS另一個元素中，例如：

div { 
/* Image SRC */ 
background: url(image.jpg) no-repeat center center fixed; 

/* Use Background Size Cover to Proportionally Fill Element */ 
-webkit-background-size: cover; 
-moz-background-size: cover; 
-o-background-size: cover; 
background-size: cover; 

/* Size Element to Desired Background Ratio */ 
width: 200px; 
height: 100px; 
}

如果確實需要生成下載裁剪的圖像，您將不得不使用一些像PHP這樣的服務器端代碼來生成圖像，請參閱此問題以獲取更多詳細信息：Crop image in PHP

來源

2016-02-20 09:03:26

作物所需方面的圖像，然後調整其大小

回答

相關問題