当前位置: 首页 > Update > 正文

手动 begin-asan 优化文章列表的摘要显示

众所周知,文章列表的摘要显示要么每篇文章手动摘要,要么设置文章自动截字。大多数人都是在主题设计的时候就有摘要自动截字,而这个功能面对全都是中文的网站没什么毛病,遇到有英文字母的摘要就计算有问题了。虽说必然有函数可以解决这个问题,但是对于强迫症的林三来说,还是需要一个百分百靠谱的方案。

于是,林三想到了 joe 主题的摘要显示方式,让 css 判断超过四行就隐藏,然后第四行尾巴加上三个点。

  1. .archive-content {
  2.     color#555;
  3.     display: -webkit-box;
  4.     -webkit-line-clamp: 4;
  5.     -webkit-box-orient: vertical;
  6.     overflowhidden;
  7.     text-overflow: ellipsis;
  8.     word-break: break-word;
  9.     line-height24px;
  10.     max-height96px;
  11.     opacity: 0.85;
  12.     font-size: 1.5rem;}

这个设计是基于原来摘要的加强,所以原来的摘要文字必须大于4行的内容,不然就没有加强的效果。

果然还是要应了那句话,见多识广,要多接触和应用才能懂得多,有些想法,才能有创造力,获得生产力的说。

相关推荐

《手动 begin-asan 优化文章列表的摘要显示》等您坐沙发呢!

发表评论

电子邮件地址不会被公开。 必填项已用 * 标注

Gravatar

? razz sad evil ! smile oops grin eek shock ??? cool lol mad twisted roll wink idea arrow neutral cry mrgreen