对于CMS来说,经常遇到的一个问题就是文章的标题有时候过长,需要我们隐藏多余的部分,并以类似...的方式表示只显示了部分文字。
那么通常实现的办法可以在动态调取文章标题时,使用substr函数:
<?php
substr($post_title, 0, 55);
?>
当然,substr只针对于单字符文字,若是像中文这种多字符文字(multi-byte string),我们需要使用
<?php
mb_substr($post_title, 0, 55);
?>
否则将会出现乱码。
那么今天我们要来介绍一下怎么利用纯CSS来实现这样的功能。
首先将我们的标题加上post-title这个class,然后添加以下CSS代码:
.post-title {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
这样就大功告成了!是不是超级简单呢;)

本文介绍了一种使用纯CSS截断过长文章标题的方法,通过设置text-overflow、white-space及overflow属性,可以优雅地处理标题长度问题。
323

被折叠的 条评论
为什么被折叠?



