年关将至，专为中文设计的排版样式，用了之后越看越舒服

大家好，我是TJ

关注TJ君，回复“武功秘籍”免费获取计算机宝典书籍

快过年啦，想必小伙伴们身边的年味越来越重了，那么TJ君就琢磨着是不是要推荐一些和我大天朝传统相关的内容。

这巧了，今天TJ君正好看到一个项目，和中国传统文化当中的赫蹏扯上了关系。

赫蹏？何为赫蹏？相信有不少小伙伴不一定认识这两个字怎么念，其实这两个字发音：hètí。其含义呢：

 

古代称用以书写的小幅绢帛。后亦以借指纸。《汉书·外戚传下·孝成赵皇后》：「武（籍武）发篋中，有裹药二枚，赫蹏书。」颜师古注：「邓展曰：『赫音兄弟鬩墙之鬩。』应劭曰：『赫蹏，薄小纸也。』」宋赵彦卫 《云麓漫钞》卷七：「《赵后传》所谓『赫蹏』者，注云『薄小纸』，然其寔亦縑帛。」

今天TJ君看到的这个项目，名字就是赫蹏，神不神奇？在今天的GitHub趋势榜上，当日新增了近500+的star，高居榜首！

赫蹏项目，其实就是专为中文内容展示设计的一个排版样式。

可能因为平时大多数的页面版式都是以英文等语言为主要考虑因素，所以在显示中文的时候或多或少有各种不如意，例如没对齐、换行错误、大小不合适等等等，看着就会让人觉得变扭。

赫蹏，就是针对整行的中文排版规范，让大家享受最质朴、古风的传统中文阅读体验！

赫蹏主要实现了以下几个功能特性：

• 贴合网格的排版布置
• 全标签样式美化
• 预置古文、诗词样式
• 预置多种排版样式（行间注、多栏、竖排等）
• 多种预设字体族（仅限桌面端）
• 简/繁体中文支持
• 自适应黑暗模式
• 中西文混排美化，不用再手敲空格（基于 JavaScript 脚本）
• 全角标点挤压（基于 JavaScript 脚本）
• 兼容 normalize.css、CSS Reset 等常见样式的重置
• 支持移动端

使用起来也不复杂，只需要两个步骤就可以：

1、在页面的 标签中引入 heti.css 文件：

<link rel="stylesheet" href="//unpkg.com/heti/umd/heti.min.css">  

2、在要作用的容器元素上增加 class="heti" 的类名即可：

<article class="entry heti">
  <h1>TJ君</h1>
  <p>TJ君最棒</p>
  ……
</article>

当然除了这个最基础的引用，小伙伴还可以选择使用额外的增强脚本，例如：

<script src="//unpkg.com/heti/umd/heti-addon.min.js"></script>
<script>
  const heti = new Heti('.heti');
  heti.autoSpacing(); // 自动进行中西文混排美化和标点挤压
</script>

我们来看下作者给出的实际效果样式：

包括黑暗模式：

是不是看着不错？有点古风？喜欢的那就来用用看吧！

点击下方卡片，关注公众号“TJ君”

回复“heti”，获取仓库地址

关注我，每天了解一个牛x、好用、有趣的东东

往期推荐