I'm coming, I'm coming.
Among the brothers who follow the old shopping, many people’s blogs are directly hosted by GitHub Pages. The name of the blog website is generally: xxxx.github.io, but the website that you make by yourself is really not very beautiful, although it can be built with the help of hexo. A lot of website styles still can’t catch your eyes, right?
Today I would like to recommend a niche GitHub project: He Wei, a very beautiful and practical open source project with super nice Chinese layout style.
赫蹏 (hètí) is a typographic enhancement designed specifically for Chinese content display. It is based on the prevailing Chinese typography norms, which can bring a better article reading experience for website readers.
1. Main features
Main features:
Typesetting that fits the grid;
Full label style beautification;
Preset styles of ancient prose and poetry;
Preset multiple layout styles (note between lines, multiple columns, vertical layout, etc.);
Multiple preset font families (desktop only);
Simplified/Traditional Chinese support;
Adaptive dark mode;
Mixed Chinese and Western languages to beautify, no longer hand typing spaces???? (based on JavaScript script);
Full-width punctuation squeeze (based on JavaScript script);
Compatible with normalize.css , CSS Reset and other common style resets;
Mobile support;
……
In addition, it also supports the following features:
Adaptive dark mode
Punctuation
Mixed Chinese and Western
Traditional Chinese support
Poetry layout
Line Note Layout
2. Effect picture
In short, it will look better when used. Come and enjoy the renderings:
The following is the preview effect.
Preview link: https://sivan.github.io/heti/
Change font
Add grid
Night mode
3. How to use
The method of use is as follows:
<head>
Introduce the heti.css
file in the label of the page :
<link rel="stylesheet" href="//unpkg.com/heti/umd/heti.min.css">
Add class="heti"
the class name to the container element to be used:
<article class="entry heti">
<h1>我的世界观</h1>
<p>有钱人的生活就是这么朴实无华,且枯燥</p>
……
</article>
Use enhanced script (optional):
<script src="//unpkg.com/heti/umd/heti-addon.min.js"></script>
<script>
const heti = new Heti('.heti');
heti.autoSpacing(); // 自动进行中西文混排美化和标点挤压
</script>
Does it feel great?
4. Download address
I put the download address in the background, follow the WeChat public account "Wander around GitHub", and reply "Typesetting" in the background to get the download link
By the way, if you have an open source and high-quality GitHub project, welcome to recommend it to me. The premise is that it is high-quality. I believe that you will always visit my traffic and let the Star of your project.
推荐阅读
0. 逛逛GitHub交流群限时加入
1. 微软给 Win10 量身打造的效率神器
2. CentOS 7 安装教程(图文详解)
3. 如何提升 B站 等级?
4. 你用过这款软件吗?