在包装器中按图像自动隐藏自动高度和宽度

Posted 2023-03-06

【中文标题】在包装器中按图像自动隐藏自动高度和宽度

【英文标题】：Hidden auto height and width automatically in wrapper by image

【发布时间】：2016-12-28 18:07:54

【问题描述】：

我想自动隐藏图像的高度 html:

<div class="category-thumbnail">
   <img class="img-responsive" src="http://www.thedeadtrees.com/wp-content/uploads/2012/10/linkin-park-environmental-efforts.jpg" >
      <div class="opacity">
        <b>Jam Wanted</b>
        <p class="description">Boleh</p>
      </div>
</div>

和css：

.category-thumbnail
border: 1px solid red;
border-bottom: 8px solid red;
height: 250px;

在我的本地电脑中，宽度成功但高度仍然溢出 和我的完整代码：https://jsfiddle.net/dedi_wibisono17/19tsojvz/

谢谢你

【问题讨论】：

请澄清您的具体问题或添加其他详细信息以准确突出您的需要。正如目前所写的那样，很难准确地说出你在问什么。

【参考方案1】：

简单使用“溢出：隐藏；”类别缩略图类中的属性。图片会自动隐藏。

【参考方案2】：

只需在 .category-thumbnail 中使用 overflow:hidden; https://jsfiddle.net/nk0a1bgp/