Dreamweaver CS3教案设计(3)

2019-03-04 14:13

三、插入水平线 1.插入水平线

(1)将光标置于“我的简历”后面

(2)执行菜单“插入记录”中的“HTML”中的“水平线”命令 2.水平线的属性面板

可以通过水平线的“属性”面板设置水平线的宽度、高度、类型、对齐方式及是否有阴影。水平线的“属性”面板如下:

四、时间日期

在Dreamweaver CS3系统中可以插入页面的制作日期和时间。将光标置于要插日期和时间的位置,选择“插入”→“日期”命令,可以在页面上插入插日期和时间,还可以设置日期和时间的格式。 五、滚动文字的应用 1.基本格式

...

示例:

啦啦啦,我会移动耶! 2.属性

(1)方向 #=left, right,up,down 举例:

啦啦啦,我从右向左移! 啦啦啦,我从左向右移! (2)方式 #=scroll, slide, alternate 举例:

啦啦啦,我一圈一圈绕着走! 啦啦啦,我只走一次就歇了! 啦啦啦,我来回走耶! (3)循环 #=次数;若未指定则循环不止 举例:

啦啦啦,我只走 3 趟哟! 啦啦啦,我只走 3 趟哟! 啦啦啦,我只走 3 趟哟! (4)速度 举例:

啦啦啦,我走得好快哟!

(5)对齐方式(Align) #=top, middle, bottom对齐上沿、中间、下沿 举例:

啦啦啦,我会移动耶! (6) 。 六、预览网页

1.执行“文件” 菜单下的“保存”命令,保存网页

11

2.按快捷键F12预览网页 教学小结:

介绍了简单文本网页的制作方法。 课外作业:

1.试写出网页中空格字符的输入方法?

2.试写出使用Enter键与Shift+Enter键在网页中的效果有什么不同? 板书设计:

任务2 插入图像

教学目标

1.掌握网页“页面属性”的设置; 2.掌握网页中图像的插入与属性设置; 3.掌握鼠标经过图像的设置; 教学重点

1.“页面属性”的设置; 2.图像的插入与属性设置; 教学难点

图像的应用与属性设置 教学内容 一、“页面属性”设置

使用Dreamweaver CS3创建了空白网页后可以对页面进行属性设置。执行“修改”→ “页面属性”命令,打开“页面属性”对话窗口:

使用“页面属性”对话框,可以设置页面的整个外观,如页面的字体、大小、颜色、背景颜色、背景图象,还可以设置链接的样式、页面的标题等。虽然页面的属性有很多,并不是一个页面要将所有的属性全部都设置,用户在使用过程中根据自己的需要进行设置。 二、插入图像 1.步骤:

(1)光村定位;

(2)执行菜单“插入记录”下的“图像”命令。 2.设置属性

12

(1)在“属性”面板的“替代”列表中输入替代文字; (2)在“属性”面板的“对齐”列表框中对齐方式。 三、鼠标经过图像 步骤:

(1)执行菜单“插入记录”中的“图像对象”中的“鼠标经过图像”命令; (2)在“原始图像”文本框中选取图像文件; (3)在“鼠标经过图像”文本框中选取图像文件; (4)单击“确定”按钮。 提示:

该效果只有在网页预览时才能看到。 教学小结:

讲述了网页中页面属性的设置、图片的应用及鼠标经过图像的设置与应用,这使得网页效果更加美观,突出显示了图文并茂的效果。 课外作业:

1.鼠标经过图像的含义是什么? 2.制作鼠标经过图像的步骤有哪些?

任务3 制作网站相册

教学目标:

1.掌握网站相册的含义;

2.掌握网站相册的制作及应用; 教学重点:

1.网站相册的制作及应用 教学难点:

网站相册的制作 教学方法:

示例演示法 教学内容:

一、创建网站相册 步骤:

(1)执行菜单“命令”→“创建网站相册”命令; (2)根据对话框设置参数。 二、美化网站相册 步骤:

(1)设置标题文字的大小、颜色;

(2)设置标题文字所在的表格的背景颜色。 提示:

在创建网站相册时,应把照片事先存在一个文件夹中,然后创建一个文件夹在创建网页时应用。 教学小结:

介绍了网页中网站相册的创建与应用。 板书设计: 课外作业:

1.网站相册的含义?

13

2.写出制作网站相册的步骤?

第3章 网页布局(8学时)

本章教学目标

1.理解表格与层的概念及特点 2.掌握表格的创建与编辑

3.掌握表格与单元格的属性设置

4.掌握通过表格进行网页页面布局的方法 5.掌握层的创建、编辑 6.掌握层属性的设置 7.时间轴的基本操作 教学重点

1.表格和层的布局

2.表格和单元格属性的设置 3.时间轴的应用 教学难点

表格的嵌套,时间轴的使用 教学方法

教师使用多媒体投影演示制作过程,学生上机操作完成实例与实训。

任务1 制作“班级课程表”网页

教学目标:

1.掌握创建表格的方法;

2.掌握表格和单元格属性设置的方法; 3.掌握表格的编辑; 4.掌握嵌套表格的应用; 教学重点:

1.表格和单元格的属性设置; 2.掌握嵌套表格的应用; 教学难点:

表格和单元格的应用及属性设置 教学方法:

任务驱动法,示例讲解法,讲练法 教具准备:

多媒体教学环境 教学内容:

第1课时

一、表格 1.表格

(1)表格的含义

表格是用于在网页上显示表格式数据以及对文本和图形进行布局的强有力的工具。表格由一行或多行组成;每行又由一个或多个单元格组成。 (2)表格的两种模式

14

Dreamweaver CS3提供了两种查看和操作表格的方式:“标准”模式(在该模式下,表格显示为行和列的网格)和“布局” 模式(允许您在将表格用作基础结构的同时在页面上绘制方框、调整方框的大小以及移动方框)。 (3)表格的标记

在HTML语言中,表格标签用表示,表格元素标签位于和之间。行标签为,单元格标签为。 2.布局

网页布局是根据网站主题和所需的栏目,对网页上的内容进行精确定位。可使用表格、层和框架布局。

一般以800×600像素和1024×768像素下全屏显示时的网页宽度来确定网页的大小。一般来说,除去浏览器的边框,800×600像素下全屏显示时的网页宽度是778或776像素;1024×768像素下全屏显示时的网页宽度为1002或1000像素。用户也可以根据设计效果指定所需的宽度。网页高度一般不受限制,可以向下适当延展。 3.嵌套表格

在使用表格对网页进行布局时,嵌套表格使用得十分广泛。嵌套表格是指在表格的单元格中再插入表格来放置网页元素。一般而言,一个网页中嵌套表格的层次不能超过3层。层次越多,文件越大,因此,应尽量采用较少的嵌套层次来进行网页布局。

第2课时

二、表格基本操作 1.表格的创建:

选择菜单“插入记录”→“表格”命令,或在插入工具栏中单击“常用”→“表格”按钮。

2.表格元素的选择: (1)表格的选择

方法一:鼠标指向表格右框线或下框线,当指针变成双向箭头时单击鼠标左键。 方法二:将光标置于表格中任意位置,在状态栏单击前面的标签。 (2)行的选择

? 单行的选择:用鼠标指向要选择行的左边线,当指针变成黑色箭头时单击鼠标左键。 ? 连续多行的选择:选择一行后,拖动鼠标选择多行。 ? 不连续多行的选择:按住Ctrl键,分别选择各行。 (3)列的选择

? 单列的选择:用鼠标指向要选择列的上边线,当指针变成黑色箭头时单击鼠标左键。 ? 连续多列的选择:选择一列后,拖动鼠标选择多列。 ? 不连续多列的选择:按住Ctrl键,分别选择各列。 (4)单元格的选择

? 单个单元格的选择:按住Ctrl键,用鼠标左键单击单元格。 ? 连续单元格的选择:按下鼠标左键在表格中拖动,选择鼠标指针划过的矩形区域中的单

元格。

? 不连续单元格的选择:按住Ctrl键,用鼠标左键依次单击各单元格。 3.改变表格大小

方法一:首先选择表格(选定的表格带有粗黑的外边框,在下边中点、右边中点和右下角分别显示控制柄),用鼠标拖动控制柄调整表格大小。

方法二:选择表格,在表格属性面板中输入表格高度和宽度的数值。 4.行高和列宽的调整

15


Dreamweaver CS3教案设计(3).doc 将本文的Word文档下载到电脑 下载失败或者文档不完整,请联系客服人员解决!
× 注册会员免费下载(下载后可以自由复制和排版)

马上注册会员

注:下载文档有可能“只有目录或者内容不全”等情况,请下载之前注意辨别,如果您已付费且无法下载或内容有问题,请联系我们协助你处理。
微信: QQ: