css定義中的overflow屬性，封裝了溢位處理的這個概念。在盒子模型中的代表標籤的矩形物件，可以通過css樣式來定義內容區域的高度與寬度，當這個內容無法容納子矩形物件時，對於這些子矩形物件必須決定怎麼顯示，顯示什麼，這樣的處理規則就稱為溢位處理。瀏覽器在做顯示運算的時候，會依照溢位處理，來計算內容區域無法容納的子矩形物件在瀏覽器上的顯示方式。
1.visible：當開發人員將矩形物件的overflow屬性設定為visible時，如果內容區域的大小能夠容納子矩形物件，瀏覽器會正常地顯示子矩形物件；當內容區域無法容納子矩形區域時，瀏覽器會在內容區域之外，顯示完整的子矩形物件。
2.hidden：
當開發人員將矩形物件的overflow屬性設定為hidden時，如果內容區域的大小能夠容納子矩形物件，瀏覽器會正常地顯示子矩形物件；當內容區域無法容納子矩形區域時，瀏覽器會顯示內容區域之內的子矩形物件，超出內容區域的則不顯示。
3.scroll：
當開發人員將矩形物件的overflow屬性設定為scroll時，如果內容區域的大小能夠容納子矩形物件，瀏覽器會正常地顯示子矩形物件，並且顯示預設滾動條；當內容區域無法容納子矩形區域時，瀏覽器會在內容區域之內顯示完整的子矩形物件，並且顯示滾動條、啟用滾動條功能，讓使用者能夠瀏覽完整的子矩形物件。
4.auto：
當開發人員將矩形物件的overflow屬性設定為auto時，如果內容區域的大小能夠容納子矩形物件，瀏覽器會正常地顯示子矩形物件；當內容區域無法容納子矩形區域時，瀏覽器會在內容區域之內顯示完整的子矩形物件，並且顯示滾動條、啟用滾動條功能，讓使用者能夠瀏覽完整的子矩形物件。
個人覺得：visible適用於，只有瀏覽器的一部分內容區域中有矩形物件時。否則，溢位的部分會對其他矩形物件造成遮擋；
hidden做的太絕了，無法顯示溢位內容！！！這個世界就不完整了啊。。。。。。
scroll基本能滿足人類的需要，通過滾動條的方式顯示完整的世界，而且不會遮擋其他矩形物件；
auto簡直就是人類的福音，在能夠完全顯示的情況下，不會加滾動條多此一舉，在溢位的時候又能夠完整呈現，簡直，完美！~
內容溢位處理
單行內容 width 100px whitespace nowrap overflow hidden text overflow ellipsis 前提 固定內容容器寬度 要求 1 禁止文字換行 whitespace nowrap 2 讓溢位文字隱藏 overflow hidden 此處設定了寬度方...
CSS 小結筆記之文字溢位處理
1 word break normal break all keep all normal 使用瀏覽器預設的換行 break all 允許單詞內換行即允許單詞拆開顯示 keep all 不允許拆開單詞顯示，連字元除外 這種方法只允許英文是使用，對中文無效。結果如下 2 white space nor...
html文字溢位處理
在前端開發的實際操作中，我們在寫頁面遇到此類問題時直接複製下列 使用即可.單行文字省略超出部分，顯示省略號 overflow hidden 超出部分隱藏 text overflow ellipsis 超出部分以省略號顯示 white space nowrap 超出部分強制不換行多行文字省略超出部分，...