overflow: hidden;
时间: 2024-06-14 09:04:05 浏览: 103
深入理解CSS overflow:hidden——溢出,坍塌,清除浮动
5星 · 资源好评率100%
overflow: hidden; 是CSS中的一个属性,用于控制元素内容溢出时的处理方式。当元素的内容超出了其指定的尺寸或者父元素的尺寸时,overflow: hidden; 可以隐藏溢出的内容,并且不显示滚动条。
这个属性通常用于父元素包含子元素时,当子元素的尺寸超过父元素时,可以使用 overflow: hidden; 来隐藏溢出的部分,以保持页面的整洁和美观。
下面是一个示例,展示了如何使用 overflow: hidden; 属性:
```html
<style>
.container {
background-color: black;
height: 50px;
overflow: hidden;
}
</style>
<div class="container">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam auctor, nunc id aliquet lacinia, nisl nunc tincidunt nunc, id lacinia nunc nunc id nunc. Sed euismod, nunc id aliquet lacinia, nisl nunc tincidunt nunc, id lacinia nunc nunc id nunc.
</div>
```
在上面的示例中,容器的高度为50px,但是内容超出了容器的高度。由于设置了 overflow: hidden; 属性,超出容器高度的内容将被隐藏起来,不会显示出来。
阅读全文