限定高度和宽度，折叠且省略号...显示文本

Question

自己格式化，一串数字和字母连一起是不会自动换行的，如果仅IE，chrome，可以设置word-break:break-all实现换行，firefox不支持这个

Answer 1

估计是要代码实现，这个文本是要放在一个格子里面的，宽度后续还可以伸缩，格式化宽度伸缩之后内容不能自动跟着变化
折叠省略号属性分别是
word-wrap: break-word;
text-overflow: ellipsis;
但是他们不能同时生效

Answer 2

text-overflow: ellipsis;要结合overflow:hidden才有用。。不过使用这2个后word-break又没有用了，所以自己写个函数格式化最好，你那种要求不是很简单<style>
.ellipsis{font-size:12px;line-height:15px;overflow: hidden;}
</style>
<div style="height: 45px;width: 30px;" class="ellipsis">123456789123456789</div>
<script>
    function cutstring(s, wl, hl) {
        var total = wl * hl;
        if (s.length <= total) return s;
        s = s.substring(0, total - 3) + '...';
        s = s.replace(new RegExp('[\\s\\S]{' + wl + '}', 'g'), function ($0) {return $0+'<br/>' });
        return s;
    }
    var div = document.getElementsByTagName('div');
    for (var i = 0; i < div.length; i++) div[i].innerHTML = cutstring(div[i].innerHTML, 5, 3);
</script>

Answer 3

一定要用text么？如果不是的话可以用textarea。可以限定行数和列数。

Answer 4

编辑状态的editor可以用你说的textarea来限定