?
本文檔使用 php中文網(wǎng)手冊 發(fā)布
overflow:<overflow-style> <overflow-style> = visible | hidden | scroll | auto | paged-x | paged-y | paged-x-controls | paged-y-controls | fragments
默認(rèn)值:visible
適用于:塊容器,伸縮盒容器,grid容器
繼承性:無
動畫性:否
計算值:指定值
取值:
visible:對溢出內(nèi)容不做處理,內(nèi)容可能會超出容器。
hidden:隱藏溢出容器的內(nèi)容且不出現(xiàn)滾動條。
scroll:隱藏溢出容器的內(nèi)容,溢出的內(nèi)容將以卷動滾動條的方式呈現(xiàn)。
auto:當(dāng)內(nèi)容沒有溢出容器時不出現(xiàn)滾動條,當(dāng)內(nèi)容溢出容器時出現(xiàn)滾動條,按需出現(xiàn)滾動條。此為body對象和textarea的默認(rèn)值。
paged-x:TODO...(CSS3)
paged-y:TODO...(CSS3)
paged-x-controls:TODO...(CSS3)
paged-y-controls:TODO...(CSS3)
fragments:TODO...(CSS3)
* CSS3新增屬性可能存在描述錯誤及變更,僅供參考,持續(xù)更新
說明:
復(fù)合屬性。檢索或設(shè)置對象處理溢出內(nèi)容的方式。參閱overflow-x、overflow-y屬性
overflow的效果等同于overflow-x + overflow-y。
對于table來說,假如table-layout屬性設(shè)置為fixed,則td對象支持帶有默認(rèn)值為hidden的overflow屬性。如果設(shè)為hidden,scroll或者auto,那么超出td尺寸的內(nèi)容將被剪切。如果設(shè)為visible,將導(dǎo)致額外的文本溢出到右邊或左邊(視direction屬性設(shè)置而定)的單元格。
對應(yīng)的腳本特性為overflow。
兼容性:
<!DOCTYPE html> <html lang="zh-cmn-Hans"> <head> <meta charset="utf-8" /> <title>overflow_CSS參考手冊_web前端開發(fā)參考手冊系列</title> <meta name="author" content="Joy Du(飄零霧雨), dooyoe@gmail.com, www.doyoe.com" /> <style> .test { overflow: auto; width: 200px; height: 100px; background: #eee; } </style> </head> <body> <div class="test"> <p>蘇打速度</p> <p>蘇打速度</p> <p>蘇打速度</p> <p>蘇打速度</p> <p>蘇打速度</p> </div> </body> </html>
點擊 "運(yùn)行實例" 按鈕查看在線實例