overflow在css中是什么意思

作者：依寞相随发布日期:2025-04-04 浏览:98

/* 示例代码 */

.container {
  width: 300px;
  height: 200px;
  border: 1px solid black;
  overflow: auto; /* 当内容超出容器时，显示滚动条 */
}

.content {
  width: 400px;
  height: 300px;
  background-color: lightblue;
}

解释说明

overflow 属性用于指定当元素的内容超出其容器时应该如何处理。
在上面的示例中，.container 的宽度和高度是固定的（300px x 200px），而 .content 的宽度和高度超过了容器的尺寸（400px x 300px）。
使用 overflow: auto; 意味着如果内容超出了容器的边界，浏览器会自动添加滚动条以便用户可以滚动查看超出部分的内容。其他常见的 overflow 值包括：
- visible: 默认值，内容不会被裁剪，可能会溢出到容器之外。
- hidden: 超出容器的内容会被隐藏，不会显示出来。
- scroll: 类似于 auto，但即使没有超出内容也会显示滚动条。

上一篇：css第几个元素

下一篇：css 六边形