1、第3章CSS入门1 1 考核知识点考核知识点CSS样式规则、CSS文本样式、CSS内联式2 2 练习目标练习目标熟练掌握CSS样式规则。灵活运用CSS内联式的引用方法。熟练掌握常用文本样式。实验实验1 1 文章排版文章排版请做出以下效果:要求:(1)标题居中显示,字体为“微软雅黑”、加粗、加下划、颜色为红色。(2)段落字体为“微软雅黑”,首行缩进2个字符,行高为24px。(3)用CSS内联式设置标题和正文的样式。3 3 实验内容及要求实验内容及要求实验实验1 1 文章排版文章排版此页面由标题、段落构成。用内联式样式设置标题样式,格式,用内联式样式设置正文段落样式,格式。标题居中,可以使用CSS
2、的水平对齐属性text-align。标题突出显示,设置字体为“微软雅黑”、加粗、加下划、颜色为红色,可以应用CSS的字体属性font-family进行字体设置,应用CSS的文字着重属性font-weight进行字体加粗设置,应用CSS的文本修饰属性text-decoration进行下划线设置,应用CSS的文字颜色属性color进行颜色设置。段落的首行缩进2个字符应用text-indent属性进行设置,段落的行高24px,应用line-height属性进行行高。4 4 实验分析实验分析实验实验1 1 文章文章排排版版1 1 考核知识点考核知识点CSS样式规则、CSS文本样式、CSS内嵌式样式、标
3、签选择器2 2 练习目标练习目标熟练掌握CSS样式规则。灵活运用CSS内嵌式样式。熟练掌握常用文本样式。熟练掌握用标签选择器设置元素的样式。实验实验2 2 文章排版文章排版要求:(1)标题居中显示,字体为“微软雅黑”、加粗、加下划、颜色为红色。(2)段落字体为“微软雅黑”,首行缩进2个字符,行高为24px。(3)用CSS内嵌式设置标题和正文的样式。(4)用标签选择器选择标题和段落。实验实验2 2 文章排版文章排版3 实验内容及要求实验内容及要求实验内容与上述实验1相同。此 页 面 由 标 题、段 落 构 成。内 嵌 式 样 式 设 置 标 题 和 正 文 段 落 样 式,在 中 添 加 标签对
4、,在该标签对中设置样式。用标签选择器选择标题设置样式,格式为h1;用标签选择器选择段落设置样式,格式为p。实验实验2 2 文章排版文章排版4 4 实验分析实验分析1 1 考核知识点考核知识点CSS样式规则、CSS链入外部样式、类选择器、id选择器、群 组选择器2 2 练习目标练习目标熟练掌握CSS样式规则。熟练掌握CSS外部样式的引用。熟练掌握常用文本样式。熟练掌握用类选择器、id选择器、群组选择器选择元素。实验实验2 2 文章排版文章排版 要求:(1)标题居中显示,字体为“微软雅黑”、加粗、加下划、颜色为红色。(2)段落字体为“微软雅黑”,首行缩进2个字符,行高为24px。(3)用CSS链入
5、外部样式设置标题和正文的样式,需要建立一个样式文件,设样式文件名为“mystyle.css”。(4)用id选择器选择标题进行样式设置,设标题的id属性值为heading,用class选择器选择段落进行样式设置,设段落的class属性值为paragraph。利用群组选择器为标题和段落定义相同的CSS样式。实验实验2 2 文章排版文章排版3 3 实验内容及要求实验内容及要求实验内容与上述实验1相同此页面由标题、段落构成。引入外部样式设置标题和正文段落样式,在中引入外部样式文件,语句为。用id选择器选择标题设置样式,格式为#heading;用类选择器选择段落设置样式,格式为.paragraph。标题和段落相同的字体样式定义在群组选择器中,格式为#heading,.paragraph 实验实验2 2 文章排版文章排版4 4 实验分析实验分析