css 圖片撐滿盒子 自適應(yīng)問題

現(xiàn)在有一張圖片500x700的圖片，需要放到在一個div里， div的寬高沒有圖片的寬高這么大，要做到自適應(yīng)，在電腦屏幕縮小時，圖片也跟著縮小，做到適應(yīng)，但是一下子卡住了，求大神們指點(diǎn)...

  <div class="box">
        <div class="son">
            <div class="son_img"></div>
        </div>
  </div>

.box{
    width: 100%;
    height: 100%;
    background: #e1e1e1;
    position: relative;
    }
    .son{
        height: 60%;
        width: 25%;
        border: 1px solid #000;
        top: 50%;
        left: 160px;
        transform: translateY(-50%);
        position: absolute;
        }
        .son_img{
            width: 100%;
            height: 100%;
            background-image: url('../images/1.png');
            background-size: cover;
            background-position: center;
        }