HTML:我怎么能这样做......!

Question

我正在开发一个应用程序,我必须在以下结构中显示用户名:

在上面的结构中,在名称字段中,它可能超出外部<div>标记的右边界,我想在接触右边框之前剪切名称值,并在最后添加字符串'...',如下所示

如何使其在名称字段中使用UTF-8,unicode或普通英文字母？

PS我使用PHP进行服务器端处理.

Answer 1

最简单的方法是在该div上设置一些CSS ...

<div style="white-space:nowrap; text-overflow:ellipsis;">Er. Christopher Allen (ChristAllenMoreTextMoreText)</div>

您还必须设置white-space属性,否则您将无法进入此省略点.你也应该设置overflow:hidden.

但是需要注意的是!这并不能在所有的浏览器.IE7及更高版本,Safari/Chrome,都很好.我相信它在Firefox中存在问题.

编辑: 这是一个Firefox解决方法.虽然不令人惊讶.