快速业务通道

CSS教程:CSS文本样式全攻略

作者 佚名技术 来源 CSS技术 浏览 发布时间 2012-03-02

序言

由于 Web 是 HTML 文档的集合体——有些是动态的,有些是静态的,有些是功能性的——它们的排版所遵循的惯例来自于我们的最佳参考对象:六个世纪的印刷传统。这种传统包括了排印。但是网络是一个全新而且截然不同的媒体,对于网站的排版来说,我们需要对印刷设计具备一种截然不同的技能组合,而且其受到的限制也更多。

Web 排版回顾

在网络上,设计者对页面外观的控制比在其它媒体上要少得多。这种情况在涉及到文件的大小,分辨率和对比度之类的画布属性的时候显得尤为明显。Web排版的质量还会受到一些严格的限制,这一点在关于排版的基础原则的文章中已经讨论过了。

其它值得一提的概念还有对比度, 可辨认性易读性——下面我们就来看看这些概念。

对比度

通过类型对比度,我们就可以很容易地将文章从空白和相邻文章中区别出来,类型对比度受到许多因素的影响,比如亮度、颜色、大小和组合。之所以在这里提到对比度,是为了指出低对比度的文本应该设置成所允许的最大尺寸。

可辨认性和易读性

在设计情景中,通过可辨认性,我们可以轻而易举地对一个文本段落进行特定信息片断扫描,而通过易读性,则使得我们能够很容易地理解一篇文章。表1列出了提高这二者之中某一个性质的质量的设计方法。

表1:可辨认性和可读性特征
对象 文本行长度 中缝(文本列之间的

间距) & 行间距

字体类型选择 对齐
易读性 中等 增大 serif 右侧不齐 [左对齐]
可辨认性 一般 sans-serif 不固定,通常是两端对齐

在下一篇文章——CSS 布局模式中我们将讨论最佳列宽。

CSS 字体属性:改变你的文本外观

排版涉及到针对文本的操作,这种操作与组合以及单个字母和词语的外观有关。后面这一类任务是由 CSS 字体属性处理的,我们将在下面进行讨论。

字体大小和单位类型选择

由于字号的变化比起字体的变化来说,更能影响页面外观,而用户代理样式表通常都能很好地处理字体的变形,因此对于文本来说,最基本的属性就是 font-size。在一条规则中应用该属性的时候,它后面会跟着一个属性值,这个值用某种单位指定了字体的大小,也有时是用关键字来表示大小的(比如 smallmedium)。

这是怎样做到的

作为样式表中最重要的声明,font-size 声明的格式是像这样的:

body {…
	font-size: 14px;
	…}

由于继承的缘故,HTML 文档中所有的字号规格都是基于 body 部分的字号声明的,不管该声明是在浏览器的样式表里面还是你的样式表里面。

浏览器默认的 16 像素对你的正文字体大小来说是个不错的起点,但大多数访问者都可以轻松阅读更小的字体。因此,许多设计者选择了更小的规格——大约 11-14 像素。

如果我们用相对值来指定字体大小,或者用关键字来为一个元素指定字体大小,而这个元素的父对象的字体大小不是关键字的话,字号设置就会通过继承来实现。

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务,公司网站:http://www.lingzhong.cn 为了给广大客户了解更多的技术信息,本技术文章收集来源于网络,凌众科技尊重文章作者的版权,如果有涉及你的版权有必要删除你的文章,请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢!

分享到: 更多

Copyright ©1999-2011 厦门凌众科技有限公司 厦门优通互联科技开发有限公司 All rights reserved

地址(ADD):厦门软件园二期望海路63号701E(东南融通旁) 邮编(ZIP):361008

电话:0592-5908028 传真:0592-5908039 咨询信箱:web@lingzhong.cn 咨询OICQ:173723134

《中华人民共和国增值电信业务经营许可证》闽B2-20100024  ICP备案:闽ICP备05037997号