css截取多行文字可以使用容器的超出隐藏来实现，注意：多行无法截取后面不会出现省略号；
1、因为要对其设定宽高，所以设置容器为block或者inline-block；
2、设置overflow:hidden让超出内容的部分不显示；
3、为了避免长单词，长的数字不换行，还需要对该容器设置:word-break:break-allword-wrap:break-word
这样就可以实现了文字的截取效果；
具体代码如下：
<style>.wordwrap{width:100pxheight:36pxline-height:18pxfont:400 12px/1.5 Simsunoverflow:hiddenword-break:break-allword-wrap:break-word}
</style>
<div class="wordwrap">
<span>文字截取文字截取文字截取文字截取文字截取文字截取文字截取文字截取文字截取文字截取文字截取</span>
</div>
加上如下的CSS设置，就是设定好宽度width，然后设置合适的word-wrap和word-break属性：
ul li{width: 100px
word-wrap: break-word
word-break: break-all
white-space: normal
}
ul里面的li折行其实跟其他块状(block)元素的折行都是一样的。以下是相关的CSS属性：
word-warp 属性设置如何处理单词的折行，可以取的值有
word-wrap: normal | break-word
word-break 属性设置如何处理单词折断，仅支持IE，可以取的值有：
word-break: normal | break-all | hyphenate
white-space 属性设置如何处理元素内的空白。可以取的值有：
white-space: normal | nowarp | pre | pre-line | pre-warp | inherit
经测试对中文也有效。
