剪辑div也剪辑滚动

Question

我有两个div，div div是div父级的内部。 div的孩子比他的父母大。所以我决定在div父级中放一个滚动条，我可以更好地看到div子的内容。

问题是现在我需要在父div中使用属性剪辑，但剪辑也会影响滚动。

我想询问是否有任何方法可以将父div和滚动大小ajdustes automaclty剪辑为滚动。

按照我的代码：

＆＃13;

＆＃13;

.outter{
    width:100px;
    height:100px;
    background-color:blue;
    overflow: scroll;
    position: absolute;
    clip: rect(23.75px 120px 120px 23.75px);
}

.inner{
    width:200px;
    height:200px;
    background-color:red;
    
}

＆＃13;

<div class="outter">
  <div class="inner"></div>
</div>

＆＃13;

＆＃13;

＆＃13;

[编辑]：

跟随我假装的结果。

如果您将上面的图像放在上面并且我上面提到的片段的结果是结果中滚动了apears cut并且图像不是

Answer 1

这就是clip属性应该做的事情，限制元素的可见区域。如果您试图剪切内部元素的内容，您可以绝对定位它。

希望这有帮助！

＆＃13;

＆＃13;

.outter {
    position: relative; 
    width:160px;
    height:160px;
    background-color:red;
    overflow: scroll;
}

.inner{
    position: absolute;
    left: -40px;
    top: -40px;
    background:url('http://placekitten.com/g/400/400');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width:400px;
    height:400px;
}

＆＃13;

<div class="outter">
  <div class="inner">
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;