Html 使用css3裁剪移动视图的最小宽度图片

我正在制作一个网页，在那里我必须使用一个图像作为桌面视图，而不是一个响应性设计，当页面变小时，图像会被裁剪

因此，为了做到这一点，我制定了一个css规则，确定最小宽度为700px

问题是，当我在cel中看到页面时，由于图像的原因，它有一个溢出x

我试过用overflow-x隐藏，制作和额外的div，比如

<div style="max-width: 100%; overflow-x: hidden;">
    <img id="pic-bg" class="col-lg-12 col-md-12 col-sm-12 col-xs-12 no-margin no-padding" src="../images/unico.svg">
</div>

是因为这个最小宽度吗？为了避免溢出，我必须如何做才能裁剪图像？

尝试以下方法： html: css: img{高度：100px；}

它会自动调整图像的大小

@media screen and (max-width: 767px){

    #pic-bg{
        min-width: 700px;
    }
}