Question

我想要隐藏孩子的某些部分，所以父容器外的所有内容都不可见（因此我的部分照片应该按照容器的高度进行裁剪）

我跟着很多论坛回答说要把容器放到亲戚身上（我必须是相对的，所以这不是一个问题）

＆＃13;

.img-container {
  margin : auto;
  overflow:hidden;
  width:250px;
  position: relative;
  height: 250px;
  border : 5px dotted gray;
}

.img-container object, .img-container img{
  position : absolute;
  display: inline-block;
}

.img1{
  top : 0px;
  left : 0px;
  width:60%;
}

.img2{
  width: 52%;
  left :120px;
  top:50px;
}

＆＃13;

<div class="img-container">
  <object class='img1' data='https://svgshare.com/i/6Pz.svg'>

  </object>
  <object class='img2' data='https://svgshare.com/i/6Pz.svg'>

  </object>
</div>

＆＃13;

https://jsfiddle.net/u0upm3j3/2/

答案：

非常好......我不明白的事情：它现在有效。

我做了什么？除了重启Chrome之外什么都没有。

谢谢D3nj，Cavdi的回答以及Creaforge和Daniel的评论，很抱歉让你失去一点时间。但实际上，我现在还不了解它是如何运作的，而不是之前......

pos中的例子运作良好。

Answer 1

img-container {
  margin : auto;
  overflow-x: hidden;
  overflow-y: hidden;
  width:250px;
  position: relative;
  height: 250px;
  border : 5px dotted gray;
}

.img-container object, .img-container img{
  position : absolute;
  display: inline-block;
}

.img1{
  top : 0px;
  left : 0px;
  width:60%;
}

.img2{
  width: 52%;
  left :120px;
  top:50px;
}

Answer 2

在css上使用它作为通用，并从图像样式中删除溢出

*, html, body {
   overflow-x: hidden;
}

隐藏的Css溢出无法工作，尽管父母的位置相对

2 个答案: