CSS overflow 屬性

定義和用法

overflow 屬性規定當內容溢出元素框時發生的事情。

說明

這個屬性定義溢出元素內容區的內容會如何處理。如果值為 scroll，不論是否需要，用戶代理都會提供一種滾動機制。因此，有可能即使元素框中可以放下所有內容也會出現滾動條。

另請參閱：

CSS 教程：CSS 定位

HTML DOM 參考手冊：overflow 屬性

實例

設置 overflow 屬性：

div
  {
  width:150px;
  height:150px;
  overflow:scroll;
  }

親自試一試

CSS 語法

overflow: visible|hidden|clip|scroll|auto|initial|inherit;

屬性值

值 描述
visible 默認值。內容不會被修剪，會呈現在元素框之外。
hidden 內容會被修剪，并且其余內容是不可見的。
scroll 內容會被修剪，但是瀏覽器會顯示滾動條以便查看其余的內容。
auto 如果內容被修剪，則瀏覽器會顯示滾動條以便查看其余的內容。
inherit 規定應該從父元素繼承 overflow 屬性的值。

技術細節

默認值： visible
繼承性： no
版本： CSS2
JavaScript 語法： object.style.overflow="scroll"

更多實例

如何使用滾動條來顯示元素內溢出的內容
本例演示當元素內容太大而超出規定區域時，如何設置溢出屬性來規定相應的動作。
如何隱藏溢出元素中溢出的內容
本例演示在元素中的內容太大以至于無法適應指定的區域時，如何設置 overflow 屬性來隱藏其內容。
如何設置瀏覽器來自動地處理溢出
本例演示如何設置瀏覽器來自動地處理溢出。

瀏覽器支持

表格中的數字注明了完全支持該屬性的首個瀏覽器版本。

Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 7.0