CSS样式定义.pdf

“CSS样式定义”对话框的设置与样式标签--yisong内部资料

“CSS样式定义”对话框的设置与样式标签

这一部分内容是以手册形式，来详细讲述“CSS样式定义”对话框各选项卡的设置，以
及个选项对应的CSS标签，这些知识对读者进一步了解和使用CSS样式是很有帮助的。这
里采用实例式的讲述方式，通过新建一个.test样式来说明个选项的设置。
一.“类型”选项卡
“类型”选项卡可以定义CSS样式的基本字体和类型设置。选项卡界面如下：

图7-15“类型”选项卡

其中的选项与CSS标签的对应关系如下表
表7-3、“类型”选项卡上各选项与CSS样式属性标记的对应关系
选项CSS属性标签属性的说明
字体font-family字体名称
大小font-size使用象素值(12px)或特定大小(特大、特小等)
样式font-style正常、斜体、偏斜体
行高line-height正常或象素值
修饰text-decoration下划线、上划线、删除线、文本闪烁
粗细font-weight磅数或特定粗细
变量font-variant正常、小型大写字母

大小写text-transform首字母大写、大写、小写、无
颜色colorRGB值、颜色名称、RGB对象

各选项的详细说明：
1．字体(font-family)
为样式设置字体(或字体组合)。浏览器使用用户系统上安装的字体系列中的第一种字
体显示文本。同一组合中的字体按优先顺序排列，以逗号隔开。如：

font-family:Arial,Helvetica,sans-serif;

Page.1
“CSS样式定义”对话框的设置与样式标签--yisong内部资料

“CSS样式定义”对话框的字体列表中并没有将系统安装的所有字体列出来，有的仅仅
是常用的一些字体。如果要使用的字体不在这个列表中可以使用该列表下端的“编辑字体列
表….”命令，调用“编辑字体列表”对话框。

图7-16“编辑字体列表”对话框

a．修改常用列表中的字体组合
从对话框顶部的列表中选择字体组合，所选组合中的字体在对话框左下角的“选择的字
体”列表中列出。右侧是系统上安装的所有可用字体的列表。如果要从该组合中除去某一字
体，选择该字体，然后按下按钮从组合中移去该字体；如果打算为该组合添加新的字体，
从“可用字体”栏中选择要添加的字体，按下按钮，该字体便会出现在“选择的字体”
栏中，即完成添加。
b．添加新的字体组合
按下按钮，建立一个新的字体组合，然后为该组合添加字体。
c．删除现有的字体组合
选择要删除的字体组合，按下按钮即可删除。
修改完成后，点击“确定”关闭该对话框，回到“类型”选项卡界面。
2．大小(font-size)
定义文本大小。可以通过选择数字和度量单位选择特定的大小，也可以选择相对大小。
以像素为单位可以有效地防止浏览器破坏文本。
表7-4[大小]的选项值与font-size的属性值
选项值对应属性值说明
极小xx-small绝对字体尺寸。最小
特小x-small绝对字体尺寸。较小
小small绝对字体尺寸。小
中medium默认值。绝对字体尺寸。正常
大large绝对字体尺寸。大
特大x-large绝对字体尺寸。较大
极大xx-large绝对字体尺寸。最大
较大larger相对字体尺寸。相对于父标签中字体尺寸进行相对增大。单位em

Page.2
“CSS样式定义”对话框的设置与样式标签--yisong内部资料

较小smaller相对字体尺寸。相对于父标签中字体尺寸进行相对减小。单位em

实例代码7-16字体大小的三中取值方式
.text{font-size:small;}
.text{font-size:12px;}
.text{font-size:20%;}

点评：使用百分比取值是基于父对象中字体的尺寸而言的。如果该属性不在样式中加以
定义而使用默认值的话，浏览器提供了预定义样式。但是可以在浏览器菜单的“Internet选
项”中更改它。
3．样式(font-style)
“正常”、“斜体”或“偏斜体”指定为字体样式。默认设置是“正常”。对于此属性的默认值
来说，IE提供了预定义样式。并可以在浏览器菜单的“Internet选项”中更改它。
表7-5、[样式]的选项值与font-style的属性值
选项值对应属性值说明
正常normal默认值。正常的字体
斜体italic斜体。
扁斜体oblique扁斜体

4．行高(line-height)
设置文本所在行的高度具体点说是字体下延与字体内部高度的顶端之间的距离。选择
“正常”自动计算字体大小的行高，或输入一个确切的值并选择一种度量单位。
实例代码7-17文字的行高
.text{line-height:12px;}
.t