html - 父 div 未将图像包装在其中

Question

我正在处理一个网站。我对 div 有疑问

    <div class="parent">
      <div class="child" style="display:inline-block; z-ndex:1000;">
        <img src="" style="max-width:100%; max-height:100%"/>
      </div>
    </div>

html:

   .parent {
       clear: both;
       float: left;
       padding:0 2%;
       width: 98%;
       padding:0 1%;
       display: block;
       height:557px;
   }

我有这样的 html，我希望我的子 div 环绕图像，所以我给了它 inline-block。但如果图像很大，我会从父 div 中获取图像。有什么方法可以在父 div 中修复它。请提供任何帮助。

Answer 1

您应该设置一些样式属性。即外部 [parent] div 的高度和宽度，以便内容受其限制。

      <div class="parent" style="height: 80px; width: 80px;">
        <div class="child" style="display:inline-block;">
          <img src="" style="max-width:100%; max-height:100%"/>
        </div>
      </div>