语法：

overflow ： visible | auto | hidden | scroll

相关属性：overflow-x , overflow-y

取值：

visible：
不剪切内容也不添加滚动条。假如显式声明此默认值，对象将被剪切为包含对象的window或frame的大小。并且clip属性设置将失效
auto：
此为body对象和textarea的默认值。在需要时剪切内容并添加滚动条
hidden：
不显示超过对象尺寸的内容
scroll：
总是显示滚动条

说明：

  1. 检索或设置当对象的内容超过其指定高度及宽度时如何管理内容。
  2. 设置textarea对象为hidden值将隐藏其滚动条。
  3. 对于table来说，假如table-layout属性设置为fixed，则td对象支持带有默认值为hidden的overflow属性。如果设为hidden，scroll或者auto，那么超出td尺寸的内容将被剪切。如果设为visible，将导致额外的文本溢出到右边或左边（视direction属性设置而定）的单元格。
  4. 自IE5开始，此属性在MAC平台上可用。

兼容性：

类型 IEInternet Explorer FirefoxFirefox ChromeChrome OperaOpera SafariSafari
版本 (√)IE6 (√)Firefox 2.0 (√)Chrome 1.0.x (√)Opera 9.63 (√)Safari 3.1
(√)IE7 (√)Firefox 3.0 (√)Chrome 2.0.x (√)Safari 4
(√)IE8 (√)Firefox 3.5

示例：

    
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="utf-8" />
<meta name="robots" content="all" />
<meta name="author" content="Tencent-ISRD" />
<meta name="Copyright" content="Tencent" />
<title>overflow</title>
</head>
<body>
<style type="text/css">
  .test_demo {overflow: scroll; height: 120px; width: 120px; background:#CCCCCC;}
</style>
<div class="test_demo">
  总是显示滚动条
</div>
</body>
</html>

快速跳转