CSS表基础概念与应用实践.pdfVIP

学习目标

1、理解CSS样式表的概念和特点

2、掌握CSS样式的定义规则

3、掌握CSS样式的分类及特点

要求记忆的内容

1、CSS样式表的定义

CascadingStyleSheets的简称，中文译为层

叠样式表，用于控制网页样式并允许将样式信

息与网页内容分离的一种标记性语言。CSS标

记由浏览器解释执行，其主要作用布局和美化

网页。

2、CSS样式表的定义规则

样式名（）{属性：值；}

要求理解的内容

CSS的CSS的

作用分类

1、可以精确地控制网页中各元素的位1、按照定义规则分：自定义样式、

置、和各种外观设置；HTML样式、CSS选择器样式

2、可以和语言相结合，产生各种2、按照使用位置分：内联样式表、

动态效果；样式表、外部样式表

3、把网页上的内容结构和格式控制相

分离。

要求熟练应用的内容

(1)自定义样式的定义方法及应用方法

以“点+自定义的样式名{}”方式定义，在应用时为添

加”class”属性。

(2)HTML样式的定义方法及应用方法

重定义特定HTML的格式。所有包含在该中的内

容将遵循重定义的CSS样式表的格式显示。

(3)CSS选择器样式的定义方法

Css选择器样式用于重新定义特定元素组合的格式设置，

或重新定义CSS允许的其他选择器表单的格式设置。

案例及任务

1、定义一个名称font01的自定义样式类，用于改变网页第二

段文字，要求：宋体，12px,红色，行高为20px

.font01{

font-family:宋体;

font-size:12px;

color:red;

line-height:20px;

}

2、重定义网页中H1，

并应用到标题文字“CSS样式表的概念”上：

H1{

font-family:微软雅黑;

font-size:32px;

}

课后练习

1、什么是CSS样式表？它主要有

什么作用？

2、CSS样式的分类有几种？

3、新建一个简单的页面，输入

两段文字，分别应用如下两个样

式：一个自定义样式font02,格

式为“黑体，24px,行高为

20px”，重定义p的格式

为“宋体12px;color:#cccccc”