Dreamweaver cs6网页设计课程教案.pdfVIP

Dreamweavercs6网页设计课程教案

红旗渠简介网页中插入文字

平顶山外国语学薛营敏

教学环

内容描述

节

1.复习站点的创建方法（教师提问，学生回答）

课前回

2.回顾DreamweaverCS6的工作界面，重点强调插入面板、属性面板和

顾

文档工具栏的位置和作用

1.教师展示两张网页效果图，一张是纯图片的红旗渠网页，另一张是图文结合

情境导

的网页，提问学生哪张更能吸引他们，并说明理由

入

2.引出本节课的主题——在网页中插入文字，强调文字在网页中的重要性

1.在index.html页面中，为红旗渠简介网页插入标题和正文文字

任务描2.设置标题文字的字体、大小、颜色，使其醒目突出

述3.设置正文文字的段落格式，如首行缩进、行距等，使其美观易读

4.在文字下方插入一条水平线，并添加网页更新日期

（一）插入标题文字

1.打开站点，双击打开index.html文件，进入设计视图

2.在页面的合适位置，单击插入面板中的文本选项，选择标题1，在弹

出的对话框中输入红旗渠简介，点击确定

3.选中标题文字，在属性面板中设置字体为方正大标宋，大小为36像素，

颜色为#9F2B2B（一种深红色），并设置文字加粗、居中

（二）插入正文文字

1.在标题下方，单击插入面板中的文本选项，选择段落，在弹出的对话

框中输入红旗渠简介的正文内容，点击确定

操作步

2.选中正文文字，在属性面板中设置字体为宋体，大小为16像素，颜色

骤

为#333333（深灰色），并设置首行缩进2字符，行距为1.5倍

3.重复上述步骤，插入其他段落的正文文字，并设置相同的格式

（三）插入水平线和日期

1.在正文文字下方，单击插入面板中的HTML选项，选择水平线，在弹出

的对话框中设置水平线的宽度为80%，高度为1像素，颜色为#CCCCCC（浅灰色），

点击确定

2.在水平线下方，单击插入面板中的文本选项，选择日期，在弹出的对

话框中选择日期的格式，如2024年11月21日，并勾选储存时自动更新，

点击确定

难点讲1.在插入文字时，若出现文字格式混乱的情况，教师可提醒学生先清除格式，

解再重新设置

2.对于文字的首行缩进设置，若学生操作困难，教师可详细讲解属性面板中

的区块选项，示范如何设置文本缩进为2字符

3.强调在插入水平线和日期时，要注意它们的位置和样式，使其与页面的整体

风格协调一致

1.学生根据教师的讲解和演示，自行在DreamweaverCS6中完成红旗渠简介网

学生练页的文字插入任务

习2.教师巡视指导，及时解答学生在操作过程中遇到的问题，对普遍性问题进行

集中讲解

作品展1.挑选几名学生的作品进行展示，让其他学生进行评价，指出优点和不足之处

示与评2.教师对学生的作品进行总结评价，对表现优秀的学生给予表扬，对存在问题

价的地方提出改进建议

1.教师带领学生回顾本节课所学的内容，包括在网页中插入标题和正文文字的

课堂小方法、设置文字格式和段落格式的技巧，以及插入水平线和日期的步骤

结2.强调文字在网页中的重要性，鼓励学生在今后的网页设计中，注重文字的排

版和美化，使网页内容更加清晰、美观，能够更好地传达信息

1.让学生在课后搜集更多关于红旗渠的文字资料，丰富网页内容，并尝试设置

课后作不同的文字