发现一个很牛逼的样式，可以自动把列表标题之类的多余文字隐藏掉，并在文字末尾显示省略号，且保持列表样式。

具体如下：

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;

其中 text-overflow 在定义了 overflow 之后才会生效。

white-space:nowrap 表示不换行。

补充：

对于一些行内标签，诸如 span、 a、 i 之类的，需要增加两项：

display:inline-block;
width:100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;

只有当标签有固定宽度的时候，才能实现多余部分省略显示。而行内标签需要添加 inline-block 宽度设置才能生效。

经验之谈，若有谬误，请留言指正。