Imges無法正常顯示

Question

在我的網站上，當用戶上傳他們的個人資料圖片時，圖片尺寸很小時會變得很有趣。下面是一個例子

我不知道該怎麼辦，有沒有辦法讓我的形象來正確時，圖像文件與大尺寸。

Answer 1

確保圖像的容器具有寬度和高度沒有圖像，圖像上使用以下

object-fit:cover; 
object-position:center; 
width:100%; 
height:100%; 

Answer 2

試試這個......

img{ 
    display: block; 
    width:100%; 
    height:auto; 
} 

Answer 3

<div class="hair_care"> 
       <img src="/Content/BusinessProfileImages/bbef41d2.jpg"> 
     </div> 

這是我的代碼下面的CSS。這對於小圖像無法工作具有大尺寸的大文件變得很好。和小文件圖像看起來很有趣。

.hair_care { 
    float: left; 
    width: 318px; 
} 

Answer 4

只需檢查IMG標籤上是否有寬度屬性或通過CSS規則應用於圖像標籤上的硬編碼像素/百分比寬度。

如果帶有IMG標籤的寬度屬性，請刪除該寬度標籤，並讓CSS控制寬度，並確保設置了「最大寬度：100％」和「寬度：自動」，這是拇指規則爲響應式設計。

img { 
    max-width: 100%; 
} 

其次，如果圖像顯示爲背景圖像，則檢查「背景大小」屬性。