5. 【原創】table設置text-overflow: ellipsis;（超出范圍顯示...）不生效

最近寫的頁面中，想讓table中的td內容超出文本之后顯示'...',但是使用text-overflow: elipsis;沒有生效，后來經過試驗才摸索出正確的設置方式。

table {
    table-layout: fixed;//表格布局：固定
    width: 200px;  //一點呀設置表格的寬度
}

td {
    white-space: nowrap;//超出文本不換行
    overflow: hidden;//超出文本隱藏
    text-overflow: ellipsis;  //超出文本顯示...
}

 還可以使用hover屬性設置鼠標懸停的時候顯示其內容。

td:hover { 
    text-overflow:inherit; 
    overflow:visible; 
}