CSS overflow 属性

来源：互联网发布：中建六局知乎编辑：程序博客网时间：2024/05/17 20:00

设置 overflow 属性：

div  {  width:150px;  height:150px;  overflow:scroll;  }

浏览器支持

所有主流浏览器都支持 overflow 属性。

注释：任何的版本的 Internet Explorer （包括 IE8）都不支持属性值 "inherit"。

定义和用法

overflow 属性规定当内容溢出元素框时发生的事情。

说明

这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll，不论是否需要，用户代理都会提供一种滚动机制。因此，有可能即使元素框中可以放下所有内容也会出现滚动条。

默认值：visible继承性：no版本：CSS2JavaScript 语法：object.style.overflow="scroll"

可能的值

值描述visible默认值。内容不会被修剪，会呈现在元素框之外。hidden内容会被修剪，并且其余内容是不可见的。scroll内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。auto如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。inherit规定应该从父元素继承 overflow 属性的值。

例子如下：

<html><head><style type="text/css">div {background-color:#00FFFF;width:150px;height:150px;overflow: hidden}</style></head><body><p>如果元素中的内容超出了给定的宽度和高度属性，overflow 属性可以确定是否显示滚动条等行为。</p><div>这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll，不论是否需要，用户代理都会提供一种滚动机制。因此，有可能即使元素框中可以放下所有内容也会出现滚动条。默认值是 visible。</div></body></html>

如果没设置overflow：hidden，结果如下：

0 0