html/css中的overflow:hidden到底是什么用处??

发布网友 发布时间：2022-04-23 21:54

我来回答

共5个回答

热心网友 时间：2022-04-06 12:25

超出之后隐藏，有一个div，高度和宽度都是100像素，当里面的内容很多，div里撑不下时，如果设置overflow:hidden，就会把超出的内容隐藏掉不显示。操作方法如下：

1、首先，html页面结构如图，有几个column，每个column里有几行方格，每个方格里有文字。文字可能过长，超出单元格大小。

2、首先禁止文字折行显示，并隐藏超出部分。对于文字元素使用white-space: nowrap样式。

3、接下来，要给宽度超出父元素的情况添加一些样式。使用js代码实现一个函数，获取所有这样的元素（如图是都含有state-text class的元素），并依次比较各自是否超过各自父节点宽度。如果超过，添加一个class用于增加样式。

4、然后，使用setInterval让这个函数每过一段时间执行一次，如图每3秒检查一下页面上所有class含有state-text的元素。

5、在js代码中，添加对应的更新css变量的逻辑。如图，获取父节点宽度，并在子节点上调用style.setProperty来设置css变量值。

6、最终实现了滚动效果，如图所示，即使各个单元格宽度不同，即使宽度是运行时变化的，它们都能实现合理的滚动显示。

热心网友 时间：2022-04-06 13:43

超出之后隐藏，比如有一个div，高度和宽度都是100像素，当里面的内容很多，div里撑不下时，如果设置overflow:hidden，就会把超出的内容隐藏掉不显示

热心网友 时间：2022-04-06 15:18

比如说你定义一个div的高度是500，然后你里面放的东西超过了，那么这个属性就是让超出的部分隐藏，不使用的话默认是auto,超出部分会使用滚动条

热心网友 时间：2022-04-06 17:09

超出部分隐藏

有时候用于消除浮动

热心网友 时间：2022-04-06 19:17

设置元素超出部分隐藏