您现在的位置： 圆点视线 >> 教程 >> 网页设计 >> CSS样式表 >> 文章正文
[图文]网页（WEB）字体，CSS如何控制？           ★★★
网页（WEB）字体，CSS如何控制？
作者：网页教学… 　文章来源：网页教学网 　点击数： 　更新时间：2007-10-24 18:14:52　
　页面功能：【发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口】 【字体：小 大】

网页（WEB）字体，CSS如何控制？

在开发网络应用时，没有比外观更重要的事情了。所以，如果发现设计人员十分关注字体及字体大小，我不会感到奇怪！

在设计网络应用时，您必须决定如何编辑字体。使用CSS时存在大量选项，每个开发者都有自己的喜好。本文主要讨论字体大小和网络应用内的操作。

字体大小

CSS2规范根据长度——水平和垂直尺寸——来定义字体。这个长度为一个数值，前面可能带一个可选的加（+）或减（-）标记符。另外，该数值后可能有一个可选的单位标识符。

另外，CSS2规范定义了两个单位类型：绝对单位和相对单位。绝对值指定单位，而相对单位指定一个与另一个值成比例的值。下面的列表列出了相对单位标识符：

em：元素字体的高度。它与使用该字体的元素的字体大小属性计算值相等。当它出现在字体大小属性值本身中时，会出现异常，这时它指母元素的字体大小。
 
ex（x-高度）：CSS2规范将它描述为小写字母x的高度。
 
px（像素）：它与背景或屏幕的分辨率有关。根据显示器分辨率输出不同像素，由于用户的喜好不同，显示器的分辨率可能会有很大差异。

下面是有效的绝对单位标识符：

in（英寸）
cm（厘米）
mm（毫米）
pt（点，1点=1/72英寸）
pc（12点活字，1pc=12点）

测量绝对大小的另一种方法是使用衡量一个值的比例因数，应用以下关键字：最小、较小、小、中、大、较大和最小。中为基值，变小就减去一个因数，变大就增加一个因数，等等。CSS2规范定义的比例因数为1.2，这个值也可能依浏览器而变化。

还可以应用百分比值来格式化文本。百分比值是一个可选的标记符，即数字后带有一个百分比符号(%)。百分比值总是与另一个值成比例。就字体而言，它与网页的基本字体大小成一定比例。

如您所见，有许多方法可完成呈现文本这个看似简单的任务。下面的HTML格式文本（在段落元素中）应用了各种单位标识符。其中所有的值都相等，并假定以72dpi进行显示。

<html><head>
<title>Font Sizing - equal values</title>
</head>
<body>
<p style="font-size: 36pt;">Point</p>
<p style="font-size: 3pc;">Pica</p>
<p style="font-size: 0.5in;">Inches</p>
<p style="font-size: 1.27cm;">Centimeters</p>
<p style="font-size: 12.7mm;">Millimeters</p>
<p style="font-size: 300%;">Percentage</p>
</body>
</html>

您可以在这个列表中增加像素值，但它的值要依环境而定。例如，我的分辨率为1280X1024的手提电脑将显示与在上表中使用50像素值一致的文本。

仔细阅读前面提到的CSS2规范，可以获得更多字体大小方面的知识。现在我将讨论如何决定在网络应用中使用哪种方法。

[1] [2] 下一页

　【发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口】　文章录入：Rainsion    责任编辑：Rainsion 　【字体：小 大】
　
  • 上一篇文章：

    • 　
  • 下一篇文章：
    • 最新文章
    相关文章
    用JS得到字符串中出现次数最多的字母
    网页制作Javascript经典小技巧总结
    XHTML+CSS的目的和好处(WEB标准的目的和好处
    深层优化 提高网站的访问速度的一些技巧
    常见的CSS问题的“一站式”的解决方案
    国外译文：网页设计如何使用CSS的选择器模式
    CSS实现图片阴影效果三部曲(译文)
    CSS实现不定高度DIV绝对居中
    25条CSS制作网页编写的提醒及小技巧整理
    Opera 中的 CSS 妙用 ── Flash block
    网友评论：（只显示最新10条。评论内容只代表网友观点，与本站立场无关！）
    发表评论：
    　姓　　名： 评 分： 1分 2分 3分 4分 5分
    　评论内容： ·严禁发表危害国家安全、政治、黄色淫秽等内容的评论。
    ·用户需对自己在使用本网服务过程中的行为承担法律责任
    ·本站管理员有权保留或删除评论内容。
    ·评论内容只代表机友个人观点，与本网站立场无关。
     
    最 新 推 荐
     
    百度主题推广
    最 新 热 门