《网页设计》课件——3-5文本样式设置.pptxVIP

文本样式设置目录◎设置CSS的字体属性◎文本属性1设置CSS的字体属性1.字体设置—font-family字体族科实际上就是CSS中设置的字体，用于改变HTML标签或元素的字体。语法：font-family:字体1,字体2,字体3;浏览器不支持第一个字体时，会采用第二个字体；前两个字体都不支持，则采用第三个字体，以此类推。浏览器不支持定义的所有字体，则会采用系统的默认字体。注意中文字体需要加英文状态下的引号，各字体之间必须使用英文状态下的逗号隔开。英文字体一般不需要加引号。当需要设置英文字体时，英文字体名必须位于中文字体名之前。如果字体名中包含空格、#、$等符号，则该字体必须加英文状态下的单引号或者双引号，例如font-family:arialblack;。2.字号大小—font-size字号大小属性用作修改字体显示的大小。语法：font-size:大小取值；取值范围：绝对大小：xx-small|x-small|small|medium|large|x-large|xx-large；相对大小：larger|smaller；长度值或百分比。注意绝对大小根据对象字体进行调节。绝对大小的单位有px（像素）、in（英寸）、cm（厘米）、mm（毫米）、pt（点），推荐使用px。相对大小则是相对于父对象中字体尺寸进行相对调节，使用em的较多。百分比取值基于父对象中字体的尺寸。3.字体风格—font-style字体风格就是字体样式，主要是设置字体是否为斜体。语法：font-style:样式的取值；取值范围：normal|italic|oblique。normal(缺省值)是以正常的方式显示；italic则是以斜体显示文字；oblique属于其中间状态，以偏斜体显示。4.字体加粗—font-weight字体加粗用于设置字体的粗细，实现对一些字体的加粗显示。语法：font-weight:字体粗度值；取值范围：normal|bold|bolder|lighter|number。normal(缺省值)表示正常粗细；bold表示粗体；bolder表示特粗体；lighter表示特细体；number表示font-weight还可以取数值，其范围是100-900，实际项目开发中主要使用normal和bold。5.小型的大写字母—font-variant小型的大写字母用来设置英文字体是否显示为小型的大写字母。语法：font-variant：取值；取值范围：normal|small-caps。normal(缺省值)表示正常的字体，small-caps表示英文显示为小型的大写字母字体。6.复合属性：字体—fontfont属性是复合属性，用作对不同字体属性的略写。语法：font:字体取值；取值：字体风格、小型的大写字母、文本的粗细、字体大小、行高、字体族科之间使用空格相连接。注意font复合属性要按照固定的font-style、font-variant、font-weight、font-size/line-height、font-family的顺序编写，不需要的可以不写，但要保证顺序正确。举例演示【实例5-1】font字体设置。2文本属性1.颜色属性—colorcolor属性用来表示文本的颜色。语法：color:颜色代码注意颜色取值可以是颜色关键字，如red，blue，green，yellow等。颜色取值也可以十六进制来表示，例如#FF0000。颜色取值还可以使用RGB代码来表示。rgb（x,x,x）其中，x是基于0~255之间的整数，例如rgb（255，0，0）。使用rgb（y%，y%，y%）表示，y是一个介于0到100之间整数，例如rgb（100%，0%，0%）。这表示为红色，当值为0时百分号不能省略。2.文本行高—line-height行高属性用于控制文本基线之间的间隔值，或者说是行与行之间的距离。语法：line-height:行高值；行高值通常使用像素px，相对值em和百分比%，实际开发中使用最多的是像素px。3.单词间隔—word-spacing单词间隔用来定义英文单词之间的间隔，对中文无效。语法：word-spacing:取值；取值范围：normal|长度。normal是指正常的间隔，是默认选项；长度是设定单词间隔的数值及单位，允许使用负值。4.字符间隔—letter-spacing字符间隔和单词间隔类似，不同的是字符间隔用于设置字符的间隔数。语法：letter-spacing:取值;取值范围：normal|长度。normal是指正常的间隔，是默认选项；长度是设定单词间隔的数值及单位，允许使用负值。5.文字修饰—text-decoratio