CSS截取字符串顯示省略號的技巧

大家知道CSS截取字符串顯示省略號嗎?下面我們就給大家詳細介紹一下吧!我們積累了一些經驗，在此拿出來與大家分享下，請大家互相指正。

有時候，為了避免頁面中某個Div的內容過多，而導致頁面變形，我們通常在CSs中定義overflow:hidden，這樣會不顯示文字，不過看上去用戶體驗不太好，為了獲得最佳的用戶體驗，我們在隱藏文字的同時，可以在文字後邊顯示省略號，CSS中有現成的方法可以用，比如下面對CSS的定義：

1/*CSS代碼如下：*/

2show{

3overflow:hidden;

4white-space:nowrap;

5text-overflow:ellipsis;

6/*為你顯示文字的div添加寬度定義，當超出寬度時會自動添加省略號*/

7width:30px;

8}

在上述代碼中，text-overflow:ellipsis就是顯示省略號的，很不錯吧?

相信大家已經學會CSS截取字符串顯示省略號了吧!感謝大家對我們網站的支持!

相關推薦：

CSSfontshiy使用技巧是什麼