纯css实现图片根据最大的边适应外框

纯css实现图片根据最大的边适应外框

 

<div class="box">

    <img src="**********.jpg">

</div>

.box {

     position:relative;

}

 

img {

    // 根据最大的边适应外框

    max-height: 100%;

    max-width: 100%;

 

  // 图片居中

  position: absolute;

  left: 50%;

  top: 50%;

  transform: translate(-50%,-50%);

}