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

衬线字体 (serif) 和无衬线字体 (sans-serif)

衬线字体 {serif} 和无衬线字体 {sans-serif}

  • 1. 衬线体 (serif)
  • 2. 无衬线体 (sans-serif)
  • 3. 中文的衬线体与无衬线体
  • 4. 衬线字体与无衬线字体
  • References

衬线字体是在字的笔画开始、结束的地方有额外的装饰,而且笔画的粗细会有所不同。

无衬线体是无衬线字体,没有这些额外的装饰,而且笔画的粗细差不多。

serif [ˈserɪf]:n. 衬线 sans serif [,sæn 'serif]:无衬线字体,灯芯体

1. 衬线体 (serif)

衬线指的是字形笔画在首位的装饰和笔画的粗细不同,衬线又被称为字脚。

1968 年 Edward Catich 神父在著作 《The Origin of the Serif》 中提到罗马字母最初被雕刻到石碑上之前,要先用方头笔刷写好样子,再照样雕凿。由于直接用方头笔刷书写会导致笔画的起始和结尾出现毛糙,所以在笔画开始、结束和转角的时候增加了收尾的笔画,自然形成了衬线。

衬线体又可以根据衬线变化可以分成三类:

  • 具有特定曲线衬线的支架衬线体 (bracket serif)
  • 连接处为细直线的发丝衬线体 (hairline serif)
  • 厚粗四角形的板状衬线体 (slab serif)

2. 无衬线体 (sans-serif)

无衬线体则没有笔画首尾的装饰,所有笔画的粗细也相同。无衬线体在 80 年代开始兴起,在当时被称为 Grotesque (荒唐的) 或 Gothic (哥特的),因为天然的技术感和理性气质,无衬线字体多为科技型企业所青睐。

无衬线的字体结构简单,在同等字号下,无衬线的字体看上去要比有衬线的更大,结构也更清晰,电子设备的屏幕上也偏好使用无衬线字体。

3. 中文的衬线体与无衬线体

中文字体界,两个有代表性的分类宋体和黑体,分别对应着衬线字体和无衬线字体。

宋体来源于中文商业雕版印刷的鼎盛时期明朝,宋体也被称为明朝体。由于雕版所使用的木头具有水平纹理,雕刻时横笔容易而竖笔更难,导致了宋体有横笔画细,竖笔画粗的特点。由于横笔画的两端容易被磨损,所以人们就为其加上了字脚,让这些地方变得更粗也更耐用。这就是宋体作为衬线体特点的由来。

4. 衬线字体与无衬线字体

衬线体棱角分明,长文阅读比较舒服。无衬线比较简洁美观,适用于短句美感提升。相比严肃正经的衬线体,无衬线体给人一种休闲轻松的感觉。

衬线字体容易识别,它强调了每个字母笔画的开始和结束,因此易读性比较高,无衬线体则比较醒目。在整文阅读的情况下,适合使用衬线字体进行排版,易于换行阅读的识别性,避免发生行间的阅读错误。

西文中,无衬线体强调每一个字母,衬线字体更强调于一个单词。

中文字体中的宋体就是一种最标准的衬线字体,衬线的特征非常明显。字形结构也和手写的楷书一致。因此宋体一直被作为最适合的正文字体。

  • 衬线字体 (serif) 字体:Times New Roman、Georgia、宋体
  • 无衬线字体 (sans serif) 字体:Verdana、Arial、黑体。

References

[1] Yongqiang Cheng (程永强), https://yongqiang.blog.csdn.net/
[2] 素材集市, http://www.sucaijishi.com

http://www.jsqmd.com/news/477241/

相关文章:

  • Flutter 三方库 google_play_scraper 鸿蒙适配指南 - 实现高性能应用商店元数据抓取、在 OpenHarmony 上打造竞品分析数据防御线实战
  • 蜂胶经常吃的品牌是选哪个? 2026年高吸收蜂胶TOP十榜单:10款实测优选! - 博客万
  • Visual Studio - 修改字体
  • 2019年年底面试了几家大型互联网公司
  • 人脸识别/戴口罩人脸识别 快速实现部署系统方案(Linux / Android)
  • scottplot5中使用signalXY图,如何更新数据?
  • Visual Studio 设置制表符大小和缩进大小
  • 自动导入 AutoImport:告别手动引入依赖,优化Vue3开发体验
  • 叶酸哪个牌子最好最有效?2026叶酸口碑榜单最新揭晓,黄余堂复配辅酶Q10全方位守护母婴安全更省心 - 博客万
  • 解决学某通中不能粘贴的问题
  • 3/14总结:第三届“东软杯”计算机创新设计大赛——基于多智能体协作的复杂数据库自然语言查询系统
  • 2026 年,企业级 AI Agent 的成熟元年
  • vue2.x中slot插槽的使用
  • 【CSS】CSS所有选择器的用法及示例(完整版)
  • FD泄漏查看
  • pycharm+pyside2+Qt Designer 关联
  • 基于LLM的电商分析系统设计
  • CAD图纸幅面
  • ubuntu 22.04 网络图标不见的问题解决方案
  • UE5.7.4源代码分析——字符类型
  • Python 基础知识
  • 基于深度学习车牌识别方案
  • PyAPS下载Climate Data Store数据
  • VM虚拟机使用的镜像文件下载
  • Visual Studio - 自动变量和局部变量十六/十进制查看
  • 数字图像加密关键技术的研究与实现(Python)
  • Python3 ---关于numpy的方法总结笔记。
  • “前端已死”的声音逐渐兴起。前端已死?尊嘟假嘟?
  • 大学生HTML期末大作业——HTML+CSS+JavaScript小说网站(起点)
  • Marqo:一站式向量搜索引擎,助力您的AI应用