最近碰到一個需求，要求是在不知道圖片寬度和高度的情況下，讓圖片在指定寬度內充滿，同時高度自適應,在網絡上查找了一下，也有很多解決方法，后來針對自己的應用，選擇了一個修改較小的方案，最后證明效果還是蠻不錯的，記錄在這里，希望能幫助到有同樣需求的人。 好了，言歸正傳 首先，需要 ...

...

在我們設計網頁的時候，經常會遇到圖片自適應問題，實際這些工作完全可以交給瀏覽器來完成就可以了，只可惜，無論是IE還是FIREFOX在圖片自適應這個問題上都處理的不盡人意，網上實現網頁圖片寬度和高度的方法也很多，主要又兩種： 第一種是使用CSS來完成；第二種是使用Javascript來完成 ...

今天和項目經理對噴了一下，他說在應用的列表數據中的圖片應該寬度固定，高度按比例縮放自適應，我說，那豈不是很丑！直接讓運營那邊把圖片處理成固定寬高比不就好了，省的我客戶端麻煩了。 這家伙不同意，為毛呢，因為我們公司的圖片尼瑪全部是從別的網站上盪過來的，幾萬張圖片，本身不知道圖片寬度和高度 ...

今天和項目經理對噴了一下，他說在應用的列表數據中的圖片應該寬度固定，高度按比例縮放自適應，我說，那豈不是很丑！直接讓運營那邊把圖片處理成固定寬高比不就好了，省的我客戶端麻煩了。 這家伙不同意，為毛呢，因為我們公司的圖片尼瑪全部是從別的網站上盪過來的，幾萬張圖片，本身不知道圖片寬度和高度 ...

...

運行如下： ...

一般在web端圖片100%自適應,在頁面加載的時候存在高度塌陷的問題 解決這個問題其實很簡單,用padding-top設置百分比值來實現自適應,公式如下 如:圖片寬400px,高200px;套用上面公式計算出padding-top:值是50%; HTML代碼 ...