overflow、overflow-x、overflow-y初识

一、overflow

overflow 属性规定当前内容溢出元素框时会如何处理。

支持情况：所有浏览器都支持overflow属性。

序号	overflow的值	描述
1	visible	默认值，内容不会被修剪，会呈现在元素框之外。没有滚动条。
2	hidden	内容会被修剪，并且溢出内容是不可见的。不会出现滚动条。
3	scroll	内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。x、y轴均会出现滚动条。
4	auto	如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。一般是y轴出现滚动条。
5	inherit	规定应该从父元素继承overflow属性的值。任何IE都不支持。

二、overflow-x

说明：是否对内容的左\右边缘进行裁剪。

语法：overflow-x：visible | hidden | scroll | auto | no-display | no-content

visible:不裁剪内容，可能会显示在内容框之外。

hidden:裁剪内容，不提供滚动机制；

scroll:裁剪内容，提供滚动机制；

auto:如果溢出，则应该提供滚动机制；

no-display:如果内容不适合内容框，则删除整个框；

no-content:如果内容不适合内容框，则隐藏整个内容。

三、overflow-y  同上

说明：是否对内容的上\下边缘进行裁剪。