overflow-y

语法

overflow-y：<overflow-style>
<overflow-style> = visible | hidden | scroll | auto | paged-x
默认值：visible
适用于：块容器，伸缩盒容器，grid容器
继承性：无
动画性：否
计算值：指定值

取值

visible：对溢出内容不做处理，内容可能会超出容器。
hidden：隐藏溢出容器的内容且不出现滚动条。
scroll：隐藏溢出容器的内容，溢出的内容将以卷动滚动条的方式呈现。
auto：当内容没有溢出容器时不出现滚动条，当内容溢出容器时出现滚动条，按需出现滚动条。此为body对象和textarea的默认值。
paged-x：TODO...（CSS3）
paged-y：TODO...（CSS3）
paged-x-controls：TODO...（CSS3）
paged-y-controls：TODO...（CSS3）
fragments：TODO...（CSS3）

说明

检索或设置对象处理纵向溢出内容的方式。

对应的脚本特性为overflowY。

兼容性

Values	IE	Firefox	Chrome	Safari	Opera	iOS Safari	Android Browser	Android Chrome
Basic Support	6.0+	2.0+	4.0+	3.1+	7.0+	3.2+	2.1+	18.0+
page-*	11.0	38.0	43.0	8.1	28.0	8.1	4.4.4	40.0
page-*-controls	11.0	38.0	43.0	8.1	28.0	8.1	4.4.4	40.0
fragments	11.0	38.0	43.0	8.1	28.0	8.1	4.4.4	40.0

示例


<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
<style>
.test {
    overflow-y: auto;
    width: 200px;
    height: 100px;
}
</style>
</head>
<body>
<div class="test">
    <ul>
        <li>新闻列表</li>
        <li>新闻列表</li>
        <li>新闻列表</li>
        <li>新闻列表</li>
        <li>新闻列表</li>
        <li>新闻列表</li>
    </ul>
</div>
</body>
</html>