Question to say "I can!"

使用 text-overflow:ellipsis 實現 CSS 文本溢出省略號

2013-03-18

在現在標題文本的時候,我們都會發現一個問題,就是有些問題的標題比較長,為了顯示美觀,我們都會將列表的標題都設置為1行,如果超出的在最后顯示 …,也許你會使用 PHP 函數來計算文字個數,但是由于中英文字數算法和長度的問題,總是不能做到很完美的效果,原來我們可以通過定義元素的 text-overflow 這個 CSS 屬性實現文本溢出省略號。


.entry_title{
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

上面 CSS 第一行是設置強制文本在一行內輸出,第二行是設置溢出處理方式,這里是隱藏,第三行是設置文本溢出的處理方式,這里是末尾加上省略號。這樣簡單處理下,就能完美實現文本溢出省略號了。

作者:admin | Categories:設計問題 | Tags:

發表評論

電子郵件地址不會被公開。 必填項已用*標注

*

澳洲f1赛车b盘开奖套路 河北快3开奖查询 福建22选5走势图浙江风采网 快乐北京8根据什么开奖 彩吧论坛 甘肃11选5 股票投资措施有哪些 广东快乐十分口诀 股票开户有什么要求 广西快3选号器下载 股票涨跌的原因 深圳福彩官网首页 股票配资是什么 119期两肖两码精准资料 湖北体彩11选5遗漏top10 甘肃快3推荐号码一定牛 投资理财平台安全吗