經常會遇到這種需求，就是根據圖片的最長邊緣來等比自適應，通過純css可以很簡單的使圖片不變形顯示。
應用場景
例如有長大於寬的 也有寬大於長的當然也有長等於寬的，但是需求是不知道圖片的長和寬哪個長，那么就需要在不管圖片的長和寬哪個長哪個短，在容器中都能自適應保持等比放大或縮小如圖：
長大於寬的圖
寬大於長的圖
長等於寬的圖
實現代碼
可以看不管圖片是什么比例的寬度，都可以自適應不變形的顯示，代碼很簡單，只需要css就可以實現,將圖片的max-width和max-height設置成100%
img {
max-width: 100%;
max-height: 100%;
}
很簡單的兩行css代碼就實現了