Css入门: overflow（溢出内容的显示方式）

Css中的overflow属性用于控制元素中内容溢出时的显示方式。当元素中的内容超出了其指定的尺寸时，可以使用overflow属性来定义溢出内容的显示方式。

overflow属性的取值

overflow属性有以下几个取值：

• visible：默认值，溢出的内容会显示在元素框之外。
• hidden：溢出的内容会被隐藏，不会显示在元素框之外。
• scroll：溢出的内容会显示在元素框之外，并显示滚动条以便查看全部内容。
• auto：如果内容溢出，会显示滚动条以便查看全部内容，如果内容没有溢出，则不显示滚动条。

overflow-x和overflow-y属性

除了overflow属性，还有overflow-x和overflow-y属性用于分别控制水平方向和垂直方向上的溢出内容的显示方式。

overflow-x属性的取值和overflow属性相同，用于控制水平方向上的溢出内容的显示方式。

overflow-y属性的取值和overflow属性相同，用于控制垂直方向上的溢出内容的显示方式。

示例代码

下面是一个使用overflow属性的示例代码：

<div style="width: 200px; height: 100px; overflow: scroll;">

  <p>这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例。这是一个溢出内容的示例