隐藏而非截断的艺术

相信大多数用 WordPress 的朋友和我一样，在侧边栏里调用最新评论用的是这个函数：

但是，Wordpress 的这个函数如果不加修饰的话会有个让人尴尬的缺陷，那就是时常会有评论撑破格式分成两行显示，这个缺陷在 IE 下尤为明显，如果有给<li>定义背景样式的话，那甚至还会在第二行评论中显示出多余的背景。当然，这不影响整个页面输出，但是相对来说有碍整体美观。

导致这一现象的原因是，该函数只对评论内容的字数截断输出，没有把评论者的用户名字数计算在内，如果评论者的用户名稍长，那就很容易造成自动换行的现象。而且1个中文字符和1个英文字符在它眼中是一样的，但是我们知道截断输出30个中文字和30个英文字母的长度明显是不对等的嘛。

要解决这一缺陷其实简单的很，只要给这个<li>限定高度，然后超出部分隐藏就行了。举个例子，在侧边栏相对应的<li>标签的 CSS 中加入以下样式就行：

当然，其中的选择器和高度值可以根据实际情况修改。这样一来，就算你给最新评论截断输出100个字都没有问题，多余的都被隐藏起来了。在我的 WordPress 日志页面中的“相关日志”版块，也有些日志标题稍长的文章被分行显示，我也用同样的方法隐藏了超出行高的部分。从这一点来说，隐藏比截断不只更美观，而且不会影响 SEO，因为只是我们看不到被隐藏的部分，但是搜索引擎的蜘蛛依然能悄然爬过。