CSS overflow 屬性
定義和用法
overflow 屬性規定當內容溢出元素框時發生的事情。
說明
這個屬性定義溢出元素內容區的內容會如何處理。如果值為 scroll,不論是否需要,用戶代理都會提供一種滾動機制。因此,有可能即使元素框中可以放下所有內容也會出現滾動條。
默認值: | auto |
---|---|
繼承性: | no |
版本: | CSS2 |
JavaScript 語法: | object.style.overflow="scroll" |
實例
設置 overflow 屬性:
div { width:150px; height:150px; overflow:scroll;
}
TIY
瀏覽器支持
所有主流瀏覽器都支持 overflow 屬性。
注釋:任何的版本的 Internet Explorer (包括 IE8)都不支持屬性值 "inherit"。
可能的值
值 | 描述 |
---|---|
visible | 默認值。內容不會被修剪,會呈現在元素框之外。 |
hidden | 內容會被修剪,并且其余內容是不可見的。 |
scroll | 內容會被修剪,但是瀏覽器會顯示滾動條以便查看其余的內容。 |
auto | 如果內容被修剪,則瀏覽器會顯示滾動條以便查看其余的內容。 |
inherit | 規定應該從父元素繼承 overflow 屬性的值。 |
TIY 實例
- 如何使用滾動條來顯示元素內溢出的內容
- 本例演示當元素內容太大而超出規定區域時,如何設置溢出屬性來規定相應的動作。
- 如何隱藏溢出元素中溢出的內容
- 本例演示在元素中的內容太大以至于無法適應指定的區域時,如何設置 overflow 屬性來隱藏其內容。
- 如何設置瀏覽器來自動地處理溢出
- 本例演示如何設置瀏覽器來自動地處理溢出。
相關頁面
CSS 教程:CSS 定位
HTML DOM 參考手冊:overflow 屬性