第9章 CSS属性设置ppt课件.ppt

《第9章 CSS属性设置ppt课件.ppt》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第9章CSS属性设置9.1设置字体样式9.2控制图文布局9.3颜色及背景9.4网页美化与超链接9.5CSS定位和CSS滤镜9.1设置字体样式9.1.1字体属性9.1.1.1font-family（字体系列）9.1.1.2font-size（字体大小）9.1.1.3font-style（文字风格）9.1.1.4font-variant（字形变体）9.1.1.5font-weight（字体粗细）9.1.1.6font（字体）9.1.2text-decoration（文字修饰）9.1.1.1font-family（字体系列）描述了用何种字体系列来显

2、示文字，可以为文字指定一种或多种字体，属性值为用逗号分隔的字体名称列表，如：p{font-family:“Arial",华文彩云,黑体,楷体}浏览器会依次查找系统中是否安装此字体。若都未安装，则用系统的默认字体显示。本节目录9.1.1.2font-size（字体大小）本属性允许我们定义字体的大小。例如P{font-size:30pt}P{font-size:200%}P{font-size:large}P{font-size:larger}P{font-size:+5pt}CSS共支持用5种方式表示字体大小。分别是磅值、相对值、关键字、相对关

3、键字和增大值。本节目录9.1.1.3font-style（文字风格）使用本属性可以使文字产生斜体效果，属性的值为italic或oblique。这两个值都能产生斜体，并且很难区分他们的差别，所以可以任选其一使用，例如P{font-style:oblique}若不想产生斜体效果，可以指定其值为默认值normal或干脆不使用本属性。本节目录9.1.1.4font-variant（字形变体）本属性的默认值也是normal，表示不作变形，若指定其值为small-caps，则小写字母都变形为小的大写字母，如p{font-variant:small-cap

4、s}…

abcABC效果如图本节目录9.1.1.5font-weight（字体粗细）本属性可以控制字体的粗细（注意和大小是不同的概念），它的默认值也是normal。可以指定其值为100到900之间并且是100的倍数的数字，共9种不同的粗细。也可以使用关键字，其中normal对应400，bold对应700，bolder和lighter分别表示比当前的值增加或减少100。例如p{font-weight:bold}p{font-weight:700}本节目录9.1.1.6font（字体）同时设置字体系列、字体粗细、字体大小和斜体等属性。要求按f

5、ont-style、font-variant、font-weight、font-size、line-height和font-family的值的顺序书写，可以缺少其中的某些值，但剩下的值必须按要求的先后顺序排列。各属性值之间以空格为分隔符，只有font-size和line-height的值之间以“/”分隔。font-family的值如果是含有多个字体系列的列表，则各系列之间以逗号分隔，如果单个系列名称中含有空格，则该系列要用双引号包括起来。本节目录9.1.2text-decoration（文字修饰）本属性可以产生文本修饰效果，它的值是下列关键字

6、的一个或多个：underline（下划线）、overline（上划线）、line-through（穿越线）、blink（闪烁）和none（无），例如p{text-decoration:underlineline-through}它产生的效果是给文字加上下划线和穿越线，如图所示本节目录9.2控制图文布局9.2.1字间距与行间距9.2.2text-align（文字对齐）9.2.3text-indent（首行缩进）9.2.1字间距与行间距1.letter-spacing（字间距）本属性可以控制文字之间的间隔距离，它的值可以是默认关键字normal，

7、表示使用正常的字符间距；也可以使用数值，它的单位是px（像素）。例如：p{letter-spacing:15px}2.line-height（行高或行间距）本属性定义了文本的最小行间距。通常浏览器将单行距离作为文本的行间距，我们可以通过line-height属性来增加行间距。本属性可以接受长度值、百分数或缩放系数。例如：P{line-height:20pt}P{line-height:120%}P{line-height:2.0}本节目录9.2.2text-align（文字对齐）本属性允许调整文本块（

或