無法在css和html中調整圖像大小

Question

img.resize{ 
    width:200px; 
    height: auto; 
} 

<img class="img-circle" src="portfolio picture.png"> 

CSS和html代碼都是。仍然不會調整大小。

Answer 1

這裏是控制規模，同時仍保持比例的最佳方式：

#your-img { 
    height: auto; 
    width: auto; 
    max-width: 300px; 
    max-height: 300px; 
} 

Answer 2

確保類名在你的CSS規則 使用的名稱匹配，並確保該路徑圖像（以src是正確的）。

否則，您使用的是正確的屬性，請參閱下面的工作示例，其中我將300px寬的圖像的大小調整爲200px，同時保持圖像的高寬比。

img.resize { 
 
    width: 200px; 
 
    height: auto; 
 
}

<img class="resize" src="http://placehold.it/300x150">

Answer 3

你沒有類.resize那就是你的形象，你的東西與類調整大小，但圖像上的唯一一類寫作風格是「IMG-圈」

.img-circle{ 
width:200px; 
height: auto; 
} 
<img class="img-circle" src="portfolio picture.png"> 

或：

img.resize{ 
width:200px; 
height: auto; 
} 
<img class="resize" src="portfolio picture.png">