网站设计之字体在页面排版上的完全攻略（网页设计怎么把字体放在中间）

我们每天设计都在与字体打交道。但是我们一直没有认真在意他们的存在。我们没有很好地使用过他们，甚至滥用他们。这一切是因为我们不了解他们。字体作为排版的重要元素之一;在设计里也是最深奥的一门学问之一。本文中，就与大家来一起探讨一下这门深奥的学问。

网站设计之字体在页面排版上的完全攻略（网页设计怎么把字体放在中间）

字体的类型

英文字体(Typeface)，分为几种大类，这是在使用英文字体的时候必须知道的基本知识：

一、衬线体(Serif)

衬线(serif)就是笔画边缘的装饰部分。下图中红色标注的地方就是衬线。

衬线设计的初衷是为了更清楚地标明笔触的末端，提高辨识率，提高阅读速度。另外，使用衬线字体会让人感觉更加的正统。所以我们常见的英文书籍，特别是论文、小说，很多都是使用衬线体来完成正文的。

网页设计中常用的衬线体有TimesNewRoman和Georgia。下图左边是12px的TimesNewRoman字体，右边是12px的Georgia。

在中文里，我们使用的宋体就是对应的衬线字体。

二、非衬线体/无衬线体(Sans-serif)

字体如果不带衬线的话，那么就称为非衬线体或者无衬线体。下图就是非衬线体。

网页设计中常用的非衬线体相对就比较多了。有Arial、Verdana、Tahoma、Helivetica、Calibri等。下图从左到右依次是Arial、Verdana、Tahoma:

那么，行距就是指两个相邻的行之间，基线的距离。行间距的单位常常使用em，也就是根据字体大小来定义行距。在浏览器中，默认的行距并没有一个准则。更具W3C提供的建议，它认为默认的行距应该在1.0em到1.2em之间。事实上，在设定行距的时候，排版上有个原则，就是行与行之间的空隙一定要大于单词与单词之间的空隙，否则的话，阅读者在阅读的时候容易“串行”，造成阅读困难。充足的行距可以隔开每行文字，使得眼睛容易区分上一行或下一行。近几年Web上对于正文的排版，大多喜欢1.5em的行距，尤其是中文网站。也就是如果使用了12px的字体大小，那么设计师常常喜欢18px的行距。1.5em确实是一个很好的经验值。事实上，中文的论文的规范也是使用1.5em的行距。

2、字间距(Letter-spacing、Tracking)

字间距是指一组字母之间相互间隔的距离。字间距影响了一行或者一个段落的文字的密度。

3、字距调整(Kerning)

字距调整是一种因视觉需要而做的技术处理。简单说，在两个特定的字符连排的时候，你可以为它们单独指定与众不同的字间距。比如当一个大写A后面跟随一个小写v的时候，两个字符间就会出现视觉上的更大的间距(实际上字间距是一样的)，这是普通的字符间距所无法解决的。如果减少它们的间距，那么其他的字母就会连成一团。这时候就需要字距调整来处理了。下图就是一个应用了字距调整的例子：

1、行长(Measure)

行长是指一段文字的宽度。如下图：

让你的链接看起来像是一个链接。

本文由潍坊网站设计公司发布，转载请注意文章出处！