overflow-x

这是一个实验中的功能
此功能某些浏览器尚在开发中，请参考浏览器兼容性表格以得到在不同浏览器中适合使用的前缀。由于该功能对应的标准文档可能被重新修订，所以在未来版本的浏览器中该功能的语法和行为可能随之改变。

概述

当一个块级元素的内容在水平方向发生溢出时，CSS属性overflow-x决定应该截断溢出内容，或者显示滚动条，或者直接显示溢出内容。

初始值visible
适用元素Block-containers, flex containers, and grid containers
是否是继承属性否
计算值as specified, except with visible/clip computing to auto/hidden respectively if one of overflow-x or overflow-y is neither visible nor clip
Animation typediscrete

用法

合法值: visible | hidden | clip | scroll | auto

overflow-x: visible
overflow-x: hidden
overflow-x: scroll
overflow-x: auto

overflow-x: inherit

解释

visible
内容不会被截断，且可以显示在内容盒之外。
hidden
内容会被截断，且不会显示滚动条。
scroll
桌面浏览器总是显示滚动条，无论内容是否发生溢出。这可以避免滚动条的显示与消失所导致的元素尺寸不确定的问题。而打印机可能会打印溢出的内容。
auto
取决于浏览器本身。当内容发生溢出时，桌面浏览器如Firefox会显示滚动条。

示例

[fixme]

规范

规范 状态 备注  
CSS Basic Box Model
overflow-x		 Working Draft

浏览器支持

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
overflow-xChrome Full support 1Edge Full support 12Firefox Full support 3.5IE Full support 5
Full support 5
Full support 8
Prefixed
Prefixed Implemented with the vendor prefix: -ms-
Opera Full support 9.5Safari Full support 3WebView Android Full support 1Chrome Android Full support 18Firefox Android Full support 4Opera Android Full support 14Safari iOS Full support 1Samsung Internet Android Full support 1.0
clip value
Experimental
Chrome No support NoEdge No support NoFirefox Full support 81
Full support 81
No support 3.5 — 81
Alternate Name
Alternate Name Uses the non-standard name: -moz-hidden-unscrollable
IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoFirefox Android Full support 81
Full support 81
No support 4 — 81
Alternate Name
Alternate Name Uses the non-standard name: -moz-hidden-unscrollable
Opera Android No support NoSafari iOS No support NoSamsung Internet Android No support No

Legend

Full support  
Full support
No support  
No support
Experimental. Expect behavior to change in the future.
Experimental. Expect behavior to change in the future.
Uses a non-standard name.
Uses a non-standard name.
Requires a vendor prefix or different name for use.
Requires a vendor prefix or different name for use.

参见