公司的**中有時候由於某些檔案的檔名太長，在固定了寬度的**或層中，這些文字不能在一行中完整顯示出來，通常都是自動回行到下一行顯示，這樣的情況對**本身並沒有錯，可是卻非常有礙於**的美觀，於是，我採取了超過固定寬度用「…」省略號表示和滑鼠經過顯示完整內容的方式來處理，使得這些內容在網頁上都是嚴格按照規定的寬度來顯示的，網頁也美觀了不少，同時，由於滑鼠經過顯示完整內容功能的存在，也不會使得網頁不便於閱讀。
實現該操作當然是應該要分兩步走：
第一步：實現用省略號「…」代替超出規定寬度的文字內容。這又分兩個部分來進行操作。
1、定義樣式
2、在合適的位置使用該樣式
文字內容
需要注意的是：
必須要在文字內容前後加上nobr標籤對才能使效果實現。很多人樣式設定和使用對了，就是因為沒有加上這個標籤才不能出現想要的效果。
文字超出部分用是省略號顯示
1 文字超出部分用是省略號顯示 text overflow ellipsis overflow hidden white space nowrap whit space屬性 normal 預設。空白會被瀏覽器忽略。pre空白會被瀏覽器保留。其行為方式類似 html 中的標籤。nowrap 文字不會換...
css 超出部分用省略號顯示
說明 text overflow 用於多行文字的情況下，用省略號 隱藏超出範圍的文字 display webkit box 將物件作為彈性伸縮盒子模型顯示，是必須結合的屬性。webkit box orient 設定或檢索伸縮盒物件的子元素的排列方式，是必須結合的屬性 一 文字顯示一行，超出部分用省略...
CSS文字超出部分顯示省略號
overflow hidden 超出的部分隱藏起來 text overflow ellipsis 超出文字以省略號 white space nowrap 不換行 overflow hidden 超出的部分隱藏起來 text overflow ellipsis 超出文字以省略號 display web...