使用JavaScript調整圖像大小，然後將它們分配給img標記

Question

我對HTML和CSS開發非常瞭解。

我有一個帶有img標記的HTML頁面。這個標籤將保存一些圖像。這些圖像具有不同的大小。我使用CSS設置了一個寬度和高度爲img的標籤。

所有圖像將使用JavaScript顯示。

可能需要使用JavaScript調整圖像大小然後才能將圖像分配給IMG標記？ 也許，我不需要那樣做，因爲我使用CSS設置了IMG大小。比例會受到限制？

對不起，我的英文。

Answer 1

如果使用css設置高度和寬度，縱橫比將不會保持。但是，如果您使用html img標籤指定任何一個屬性，則會保持寬高比。

Answer 2

你應該在服務器端做到這一點。使用管理腳本。您可以在上傳時創建原始圖像的版本，然後HTML/CSS端可以安全地使用這些圖像。

這不是客戶端的任務。基本上你在這裏做的是下載一個大的圖像（大量的數據），然後啞下來創建一個較小的圖像。所以你正在浪費客戶端的帶寬和服務器的帶寬。

如果沒有絕對療法可能和你有一個固定的區域說640×480，那麼你就可以acieve基本的裁剪與維護ascpect比下列要求：

HTML：

<div id="wrapper"><img src="my.jpg"></div> 

CSS：

#wrapper { 
    width: 640px; 
    height: 480px; 
    line-height: 480px; 
} 

#wrapper img { 
    width: 640px; 
}