overflow屬性-原本是ie浏覽器獨自開發的屬性,由於在css3中被采用,得到了其他浏覽器的支持。
指定對於盒內容納不下的內容顯示的方法。
Overflow:hidden 對於超出容納范圍的文字會被隱藏。
Overflow:scroll div元素出現固定的水平滾動條與垂直滾動條
Overflow:auto 當文字超出是根據需要才會出現水平滾動條或者垂直滾動條
Overflow:visible 則顯示效果與不使用overflow屬性時一樣
Overflow-x、Overflow-y可以單獨指定水平方向上或者垂直方向上內容超出盒的容納范圍時的顯示方法。出現滾動條。
Text-overflow:設置內容在水平方向出現省略號。(white-space:nowrap使得盒右端內容不能換行顯示。)
.text{
width:200px;
text-overflow:ellipsis;
-o-text-overflow:ellipsis;
-webkit-text-overflow:ellipsis;
-moz-text-overflow:ellipsis;
white-space:nowrap;
}
<div class="text">文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例文字實例</div>