第16章 字体设置.pptVIP

第16章 字体设置(初级) 本章开始讲解CSS属性方面的知识，学好这些知识，才可以很灵活地应用CSS，对页面的控制了如指掌，更早地实现网页制作的工作。本章讲的是CSS中的字体属性，字体属性在CSS中语法用font表示，还有一系列的字体属性都与font有关，接下来会一一介绍。字体设置对网页布局起重要作用。 本章即将进入CSS属性学习的天堂，学完后会即可掌握以下内容： 字体和字体颜色 字体类型 字体大小 字体重量 行距 间距与间隔 16.1 字体的复合属性 字体是给对象设置文本特性的属性，而且是复合属性，所谓复合属性是指该属性是由多种属性组合而成，在CSS中字体用font表示，字体font的语法形式如下： font : font-style || font-variant || font-weight || font-size || line-height || font-family font代表字体的意思，冒号（:）后面接的就是font的参数，而复合属性的参数刚好是其他属性，这样在font中，只输入这些单个属性值就行，且每个参数只允许出现一个值，省略某些属性，系统会按其默认值设置，下面是对各单属性作为字体的参数介绍，其中有normal作为参数值的一般都是默认值。 Font属性中的第一个参数font-style是设置对象中字体的样式，可选参数为：normal、italic和oblique三种，分别代表正常字体、斜体和倾斜的字体，其中normal是默认值，以下都相同。 Font-variant表示对象中的文本是否为小型的大写字母，也有两个可选参数：normal和smal-caps，分别表示正常字体和小型大写字母的字体。 Font-weight设置对象文本的粗细，也称字重，详情请看16.4。 Font-size设置对象文本字体大小，详情请看16.3。 Font-family设置对象文本字体名称序列，详情请看16.5。 16.2 字体颜色 在网页中各种文字呈现出五颜六色，这都由字体颜色所决定的，字体颜色在HTML也学过，那只是HTML中的font标签，而本小节要学习的是用CSS来控制字体颜色，达到轻量级代码，重量级的效果。 字体颜色是对对象的字体设置颜色，用color表示，无默认值，所接的值是颜色值，颜色值的表示方法在本书是有介绍，但常用的是#RRGGBB，本书是的实例大部分采用此方式。其语法形式如下： /*CSS代码：设置字体颜色*/ color:颜色值 颜色值表示方法有三种，#RRGGBB、rbg（R,G,B）和颜色名。建议使用#RRGGBB，所以浏览器都支持这种颜色值。下面代码表示了一个层中的字体，其颜色是红色。 16.3 字体大小 设置字体大小和设置颜色一样，都是对于对象的文本设置的。字体大小用font-size表示 ，font和size中间是横线，而不是下划线。Font-size后面可接的参数值有：xx-small|x-small|small|medium|large|x-large|xx-large|larger|smaller|length，代表字体尺寸的值。 参数xx-small指绝对字体尺寸，是最小的。而x-small是较小，但比xx-small稍大点，而参数small是小的值，medium是默认值，对象字体正常大小值，比medium大点的是参数large，绝对字体尺寸中大的值，同理，x-large是较大值，xx-large是最大的值。 要注意的是，参数larger是相对字体的尺寸，相对于父对像中字体尺寸相对增大，使用成比例的em单位计算，与之相对应的是smaller，相对于父对像中对字体尺寸相对减小，也是使用成比例的em单位计算。最后的length是百分数|浮点数字和单位标识符组成的长度。但不能为负值，百分比取值是基于父对象中字体的尺寸，下面用实例比较各个字体的大小，代码16.3演示了字体大小的用法。 16.4 字体重量 字体重量也就是字体粗细，其语法用font-weight表示，作用由用户端系统安装的字体的特定字体变量映射决定，系统选择最近的匹配。也就是说，用户可能看不到不同值之间的差异。 字重font-weight有多个参数可选择，除字母表示不同的字重外，还可以用数字表示，数字越大，字体越粗，但数值也是有限的选择，下面表示字体重量（font-weight）的完整语法形式。 font-weight:normal|bold|bolder|lighter|100|200|300|400|500|600|700|800|900 参数normal表示正常大的字体，相当于用数字400表示，而bold是粗体格式，相当于700，或者用b/b标签对表示的字体重量。 Bolder和lighter表示不是一个具体值，前者比