设置 SVG 图像和 img 的最小宽度（以 % 为单位）

Question

是否可以设置 SVG 图像的最小宽度（以 % 为单位）？因为它不适合我。对于图像也是如此。两者都设置为 100% 适合包含的 div。当我调整浏览器大小时，我希望图像在达到最小宽度时停止调整大小。

html

<div id="first">
  <img href="" alt="si"/>
</div>

CSS

#first{
    background-color:black;
    width:100%;
    height:30%;
    position:fixed;
    overflow:hidden;

}
#first img{
    width:100%;
    min-width:50%;
}

Answer 1

是%相对于父级的宽度div，而对于最外层来说，div它是相对于浏览器的宽度。

假设您希望图像不小于 200px，请使用下面的脚本

#first img{
    width:100%;
    min-width:200px;
}

此处，如果#first宽度大于 200 像素，则图像会缩放或保持最小 200 像素。