在对网页进行美化的时候， 我们经常会需要截断内容， 以显示简洁内容， 然后通过链接查看详细内容， 以下给出两个例子。
eg-1:
对于此情况， 并不是使用css控制显示省略号， 而是从服务器获取的内容自带省略号。 对于如何将图文并茂的文章， 简化为无样式简单文本， 不是此博客所讨论的， 唯一的提示：使用正则表达式。
eg-2:
这就是第二种情况， 这里的省略号是用css设置的， 这也是这篇博客主要讨论的情况。
对于第二种情况， 你可能会疑问， 为何不在服务器端对其长度进行设置， 就像第一个实例一样。 使用这种方式， 你可能会看到：
因为中文的占位相对英文较大， 所以在截取相同长度的时候， 会显得不太美观（你丫的后面还有那么大位置， 你省略个毛线啊。。。）
当然， 有的大神们可能喜欢截取指定字节的文字， 这样就会相对平衡了， 不过个人暂时还是比较偏向使用这个CSS来设置， 毕竟相对让服务器花时间去计算截取字节， 还不如让客户端的css来让服务器休息一下。 当然， 也可是使用javascript来完成这个截取的任务， 但是我还是觉得一句简单的Css比较方便。
本来eg-2的示例， 我准备在新闻网站上找的， 但是我随便看了下两个较大的新闻网站，他们类似这样的一个标题， 并没有截取， 而是有多少就显示多少。 当然， 他们能这样做， 可能是因为新闻对标题有字数限制吧。你可以看到左边的图或eg-2的图， 如果不做标题省略， 当标题过长， 标题将自动换行， 而又因 我们在设计时， 会设置新闻显示框的高度。 你可以想象， 在左边每个标题都需要换行显示时， 新闻标题将会纵向溢出。因为新闻标题限制的问题， 所以他们不会出现这种溢出。
上面说的一大串， 只是为了说明——对于标题长度无具体限制的情况下， 省略标题多余内容是很有必要的， 具体使用哪种方式， 这个看个人喜好。 这里主要介绍以css的形式省略。
废话结束， 现在来介绍如何通过css来设置溢出省略， 方法很简单， 百度一下“css 溢出显示省略号”， 你即可得到答案。
在你需要设置内容溢出省略的标签里添加如下属性：
{overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
在设置该属性后， 便可实现内容溢出显示省略号。这里还有一点， 在对li设置该属性后， li前面的标记将会消失， 你还需要为li添加一个样式属性：
{list-style-position:inside;}
写博客， 并不一定因为它的内容高端， 也可以因为它容易被遗忘， It's like keeping the diary.