CSS提供了一个称为 溢出的属性，该属性告诉浏览器如果盒子的内容大于盒子本身的大小，该怎么办。此属性可以采用以下值之一-
| 值 | 描述 |
|---|---|
| 可见 | 允许内容溢出其包含元素的边界。 |
| 隐 | 嵌套元素的内容仅在包含元素的边界处被切除，并且没有滚动条可见。 |
| 滚动 | 包含元素的大小不会改变，但是会添加滚动条以允许用户滚动以查看内容。 |
| 汽车 | 目的与滚动相同，但仅在内容溢出时才显示滚动条。 |
您可以尝试运行以下代码以实现 溢出属性-
<html>
<head>
</head>
<style>
.scroll{
display:block;
border: 2px solid green;
padding:10px;
margin-top:10px;
width:300px;
height:50px;
overflow:scroll;
}
.auto{
display:block;
border: 2px solid green;
padding:10px;
margin-top:10px;
width:300px;
height:50px;
overflow:auto;
}
</style>
<body>
<p>Example of scroll value:</p>
<div class = "scroll">
I am going to keep lot of content here just to show you how
scrollbars works if there is an overflow in an element box.
This provides your horizontal as well as vertical scrollbars.
</div>
<br />
<p>Example of auto value:</p>
<div class = "auto">
I am going to keep lot of content here just to show you how scrollbars
works if there is an overflow in an element box. This provides your
horizontal as well as vertical scrollbars.
</div>
</body>
</html>