Question

我的内部有一个div图像，div溢出被隐藏，因此如果有多余的宽度或高度，它们的图像将被裁剪，它工作正常但有时却没有。怎么了？我试过这个

Jquery的

 $("#covorpic").on("load" , function(){
    var covwidth = $("#covorpic").width();
    if (covwidth>750){
        $("#covorpic").css({"margin-left":(750  -  $("#covorpic").width())/2});

    }
    else{
        $("#covorpic").css({"width" : "750px" });

        $("#covorpic").css({"margin-top":(200  -  $("#covorpic").height())/2});

    }
});

HTML

<div class="covor_cont">
   <img id="covorpic" src="someimage.ext">
</div>

CSS

 .covor_cont{
   max-height: 200px;
   min-height:130px;
   overflow: hidden;
   text-align: center;
   }
#covorpic{
   height: 200px;
  }

Answer 1

您应该可以在CSS中执行此操作，尝试

.covor_cont {
    width: 750px;
}
#covorpic {
    max-width: 95%;
}

将容器设置为精确大小，如果大于容器，则将图像上的最大宽度设置为收缩。

图像拉伸和裁剪以适合确切的大小

1 个答案: