圖片大小HTML和CSS

Question

我有一個產品下拉菜單，我想要下拉菜單中每個選項旁邊的產品圖片。 我正在使用這條線來做到這一點

<img src="http://www.products.com/products/product1.png" 
alt="Product1" height="20" width="22" class="itemImg" 
style="float:right;position:absolute; top: 6px; right: 20px;">

但是，當復制此行以用於多種產品時，即使我給出了高度和寬度，並非所有圖片看起來都一樣。 是否可以立即使所有圖片具有相同的大小，而不必修改每張圖片的高度和寬度？

Answer 1

您的問題尚不清楚，您應該提供更多代碼，但是可以！ 您可以應用css制作相同大小的圖片。 並刪除position: absolute因為所有position: absolute將相互重疊。 我創建了一個片段檢查，希望它能起作用。

 img.itemImg{width:150px; height:150px; background-color:green; position:relative !important;} 

 <img src="http://www.products.com/products/product1.png" alt="Product1" height="20" width="22" class="itemImg" style="float:right;position:absolute; top: 6px; right: 20px;"> <img src="http://www.products.com/products/product1.png" alt="Product1" height="20" width="22" class="itemImg" style="float:right;position:absolute; top: 6px; right: 20px;"> <img src="http://www.products.com/products/product1.png" alt="Product1" height="20" width="22" class="itemImg" style="float:right;position:absolute; top: 6px; right: 20px;"> <img src="http://www.products.com/products/product1.png" alt="Product1" height="20" width="22" class="itemImg" style="float:right;position:absolute; top: 6px; right: 20px;"> <img src="http://www.products.com/products/product1.png" alt="Product1" height="20" width="22" class="itemImg" style="float:right;position:absolute; top: 6px; right: 20px;"> <img src="http://www.products.com/products/product1.png" alt="Product1" height="20" width="22" class="itemImg" style="float:right;position:absolute; top: 6px; right: 20px;"> <img src="http://www.products.com/products/product1.png" alt="Product1" height="20" width="22" class="itemImg" style="float:right;position:absolute; top: 6px; right: 20px;"> <img src="http://www.products.com/products/product1.png" alt="Product1" height="20" width="22" class="itemImg" style="float:right;position:absolute; top: 6px; right: 20px;"> <img src="http://www.products.com/products/product1.png" alt="Product1" height="20" width="22" class="itemImg" style="float:right;position:absolute; top: 6px; right: 20px;"> <img src="http://www.products.com/products/product1.png" alt="Product1" height="20" width="22" class="itemImg" style="float:right;position:absolute; top: 6px; right: 20px;">