簡易處理圖片在div中居中鋪滿

流火行者發表於2017-12-05

原文地址：http://www.cnblogs.com/JimmyBright/p/7681089.html  

 

經常需要在一個長寬固定的div裡存放一個圖片，這個圖片長寬未知，所以需要圖片自適應div顯示

 1 .imgBox img {
 2   max-width: 100%;
 3   max-height: 100%;
 4   /* min-width: 195px; */
 5   box-sizing: border-box;
 6   position: absolute;
 7   left: 50%;
 8   top: 50%;
 9   transform: translate(-50%, -50%);
10 }
imgBox 是一個長寬固定的div，如下樣式
1 .imgBox {
2   /* width: 195px;
3     height: 195px; */
4   background: transparent;
5   position: relative;
6   left: 0;
7   top: 0;
8   border: 1px solid rgba(0, 0, 0, 0.2);
9 }

 

相關文章