css3控制標題字數超出的部分自動顯示為“...”省略號

css3功能強大，可以讓超出指定寬度的部分自動顯示為“...”

代碼如下

 

display:block;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;width:20px;

注意：

1、這個必須是塊元素才能實現效果；width是控制顯示的寬度的，根據自己的需要做修改；

2、text-overflow:ellipsis;溢出的部分顯示省略符號來代替

3、white-space:nowrap;文本不會換行，文本會在在同一行上繼續，直到遇到 <br> 標簽為止。

4、overflow:hidden;溢出隱藏，這個大家應該都知道。

優點：有利於優化，因為雖然網頁不顯示，但是源代碼中是有萬整的標題，有利於SEO。兼容性比較高。