8

标题几乎问了这个问题，但我知道使用overflow-y: hidden，overflow-x: hidden您可以隐藏元素的顶部和底部或左侧和骑乘侧，但有没有办法使用这些选择器仅隐藏一侧。

特别是我有兴趣隐藏一个溢出但不是顶部的 div 的底部。

如果没有，是否有任何其他 CSS 唯一方法来实现这种预期效果？

需要这个是有合法目的的，我想看看是否有标准的方法来做到这一点。

稍微解释一下，我只控制幻灯片的 CSS，我需要将幻灯片中的一个元素div向上推，div但是当我这样做时，这些overflow: hidden值会切断这个向上推。div我当然可以完全删除，overflow: hidden但这并不能制作一个非常好的幻灯片！

下面包括一个小提琴：

https://jsfiddle.net/ejhyz7t3/

4

3 回答 3

2

以下基于问题示例的 jsfiddle 提供了使用以下方法仅切断底部边缘的预期效果clip：

https://jsfiddle.net/ejhyz7t3/2/

完整代码复制如下以供参考：

HTML

<div class="outer-container">
   <div class="inner-container">
   </div>
</div>

CSS

.outer-container {
  background: red;
  height: 100px;
  margin-top: 100px;
  width: 150px;
  padding-left: 50px;
}

.inner-container {
  background: green;
  height: 200px;
  width: 100px;
  transform: translateY(-50px);
  position: absolute;
  clip: rect(0, 100px, 150px, 0);
}
于 2017-07-25T17:40:47.377 回答
0

我有一个类似的问题，我有一个可拖动的 div，我想向右/向下溢出，但不是向上/向左。我通过调整 z-index 解决了这个问题。容器 div 到 z-index:0px; 可拖动到 z-index:500px; 以及顶部和左侧（菜单）中的 div 到 z-index:1000px;。这有效地将可拖动层夹在中间，允许在我想要的方向上溢出。

于 2013-08-26T17:39:49.207 回答
-1 
.mydiv {  
    clip: rect(-100px, -100px, auto, -100px);  
}

将剪辑矩形的底部设置为auto类似的剪辑overflow: hidden。这些-100px值是任意选择的，以便为溢出留出一些空间。

于 2015-11-09T12:21:17.853 回答