060901商务网站页面设计技术(2pian_2).docVIP

本章内容提要这一章 本章内容提要 这一章共分为7节，主要对CSS样式表中常用的基本属性进行介绍，具体内容包括： 字体属性、前景色与背景属性 文本属性、容器属性 列表样式属性、定位与显示属性 鼠标光标形状属性 10.1 字体属性 一、属性功能 该属性用来描述文档中各种字体的属性及其取值，如字体族（FONT-FAMILY）、字体大小（FONT-SIZE）、字体样式（FONT-STYLE）等。 二、语法格式 字体属性的语法格式为：字体属性名称：字体属性值（或属性值列表）。 三、字体主要属性 字体的主要属性及其取值如表10.1所示。 表10.1 字体的主要属性定义 属性名称 属性值 属性说明（或功能） font-family（字体族） [字体名|字体族名],...[字体名|字体族名] 1、字体族名有五种，Serif(衬线字体)、 Sans-Serif(无衬线字体)、 Cursive(草书) 、Fantasy.(幻想)、 Monospace(等宽字体)。 2、字体族属性值中定义了一系列字体（族）名，浏览器按顺序读取这些字体，并使用其中第一个可以使用的。 font-size（字体大小） 绝对大小、相对大小、数值、百分比大小。 1、字体大小值有四种：绝对大小（small、medium、large等，每个属性值的具体大小由浏览器决定）,相对大小（smaller、larger，分别表示在原有大小的基础上“缩小”或“增大”一级）,数值(常用单位有：英寸in、毫米mm、派卡pc、点pt、像素px小写x的高度ex、大写M的高度em等),百分比大小 2、该属性适用范围为所有标记，默认值为medium。 font-style（字体样式） normal、italic、 oblique 1、字体样式值有三种：普通（normal）,斜体（italic）,倾斜(oblique)。 2、该属性适用范围为所有标记，默认值为normal。 font-weight（字体粗细） Normal、 bold 、bolder 、lighter、数值 1、字体粗细值有五种：普通（normal，即不加粗),加粗（bold),较粗(bolder），lighter，数值（100-900,普通为400，900为最粗）。 2、该属性适用范围为所有标记，默认值为normal。 font-variant（字体变形） Normal、small-caps 1、字体变形值有二种：普通（normal）,小型大写字母（small-caps），即当文字中字母是大写的时候，该值会显示比小写字母稍大的大写字母。 2、该属性适用范围为所有标记，默认值为normal，目前未得到广泛支持 font字体） 字体属性值列表 1、字体（font）采用字体属性值列表的方式，对字体的多个属性值进行一次设置。 2、字体属性值列表按顺序依次是：样式、变形、粗细、大小、行高（参见10.3节）、字体名、字体族。如果某个属性值为空，则以默认值代替，但字体大小和字体族不能够为空 四、属性代码示例 （一）字体族（FONT-FAMILY）举例： 1、功能：本例的功能是定义P标记的字体族样式。 2、具体代码如下： p{font-family:New Century Schoolbook,Times,Serif} 3、说明：New Century Schoolbook,Times为字体族Serif(衬线字体)中的两种字体名，如果浏览器中无前两种字体名，则会使用字体族Serif(衬线字体)中的其它字体。 注意 注意 任何包含空格的字体名都必须用单引号或双引号定界。 （二）字体大小（FONT-SIZE）举例： 1、功能：本例的功能是定义标记的字体大小样式。 2、具体代码如下： 绝对大小：h1{font-size:large}， 相对大小：strong{font-size:larger} 数值大小：p{font-size:10pt}， 百分比大小：h2{font-size:80%}， （三）字体样式（FONT-STYLE）举例： 1、功能：本例的功能是定义标记的字体样式。 2、具体代码如下： h2{font-style:oblique}，p{font-style:normal}，h1{font-style:italic} （四）字体粗细（FONT-WEIGHT）举例： 1、功能：本例的功能是定义标记的字体粗细样式。 2、具体代码如下： ? h2{font-weight:800}，p{font-weight:normal}，h1{font-weight:bold} （五）字体（FONT）举例： 1、功能：本例的功能是定义P标记的字体样式。 2、具体代码如下： ? p{font:italic bold 12pt/14pt Times,Serif}