尺寸不固定的圖片在div中垂直居中並徹底顯示

前幾天作一個項目，須要批量上傳圖片，圖片外側div尺寸固定；因爲圖片是用戶輸入的，因此大小存在不肯定性，產品需求是不管圖片尺寸多大，都要垂直居中徹底顯示

廢話很少說，直接上代碼

html

　　<ul>
        <li>  
            <img src="pics/1.jpg" alt=""/>  
        </li>  
        <li>  
            <img src="pics/2.jpg" alt=""/>  
        </li>
    </ul>

css

*{padding:0px;margin:0px;list-style: none;}
a img{border:0;}
li{  
    position: relative;  
    left:100px;  
    top:100px;  
    width:300px; 
    height:200px;
    border: solid 1px red;  
    overflow: hidden;  
}  
img{  
    position: absolute;  
    margin: auto;  
    top: -9999px;  
    right: -9999px;  
    bottom: -9999px;  
    left: -9999px;  
    max-width:100%;
    max-height:100%
}  

結果