计算机实用技术教学课件 刘毅 第3章 制作简单的网页.ppt

《计算机实用技术教学课件 刘毅 第3章 制作简单的网页.ppt》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、制作：杜丽君第3章制作简单的网页目录3.1网页的基本操作3.2文本的插入和编辑3.3图像的插入和编辑3.4表格的插入和编辑3.5多媒体的使用和编辑3.6超链接的使用3.7CSS样式表的使用3.8框架的使用3.1网页的基本操作1、创建文件“起始页”窗口的【新建】

2、【HTML】命令选择菜单【文件】

3、【新建】命令2、保存文件选择菜单【文件】

4、【保存】命令选择菜单【文件】

5、【另存为】命令。3、打开和关闭文件选择菜单中【文件】

6、【打开】命令，在“打开”对话框中选择想要修改的文件即可。关闭文件可以单击标题栏的“关闭”按钮，也可以选择菜

7、单中的【文件】

8、【退出】命令。4、网页页面属性的设置网页页面属性是指网页外观（如文本的大小、颜色、格式等）、页面内链接效果、各级标题的字体样式等。（1）设置文档标题可在“文档”工具栏的”标题”文本框中输入文档标题（2）设置页面属性打开页面属性对话框的方法：选择菜单【修改】

9、【页面属性】命令。单击“属性”面板中的“页面属性”按钮页面属性窗口“外观”：设置页面的一些基本属性。我们可以定义页面中的默认文本字体、文本字号、文本颜色、背景颜色和背景图片等“链接”：是一些与页面的链接效果有关的设置。“标题”：用来设置标题字体的一些属性

10、。“标题/编码”：“标题”用来修改新建文档的标题，显示在浏览器标题处和编辑软件的标题处。编码可修改页面编码信息，。“跟踪图像”：文本框用来设置在页面编辑过程中使用的描图图像的地址和名称。3.2文本的插入和编辑3.2.1插入文本3.2.2设置文本格式3.2.1插入文本1、输入文本输入时如果按回车键换行会便会另起一个段落，在段落与段落之间会产生一个空行。如果希望文本换行后不产生空行可以按Shift+Enter组合键或选择菜单【插入】

11、【HTML】

12、【特殊字符】

13、【换行符】命令换行，2、复制和粘贴选择“编辑”菜单中的“首选参数”

14、选项，可在“复制/粘贴”分类设置粘贴的方式。3、导入文档选择【文件】

15、【导入】命令。3.2.2设置文本格式设置文本格式可以通过“属性”面板来完成，如图3-9所示。1、文字属性的设置（1）设置文字字体：选择菜单中【文本】

16、【字体】选项中的相应字体选项；或者在“属性”面板上“字体”下拉列表中选择相应的选项。Dreamweaver默认字体较少，如果字体列表中没有需要的字体，可以在“编辑字体列表”对话框中添加需要的字体到字体列表中。（2）设置文字字号选定要改变字号的文本，选择“属性”面板上“大小”的下拉列表中选择相应的选项。注意：

17、如果单位设置为“点数(pt)”，设置为点数的文字的大小不会随着分辨率的改变而发生变化，像素则正好相反。（3）设置文字颜色：选择“文本”菜单中“颜色”命令，在随后出现的对话框中选择所需要的颜色。（4）设置文本样式：选择“文本”菜单中的“样式”选项设置更多类型的字体样式。2、设置段落对齐方式对齐段落有三种方式：左对齐、居中和右对齐可以使用“文本”菜单中“对齐”子菜单进行设置3、使用列表有序列表又称为编号列表，所有项目前使用有序的数字符号进行排列。无序列表又称为项目列表，所有项目前使用相同的项目符号进行排列。（1）创建列表：选择

18、“文本”→“列表”选项（2）修改列表属性选择【文本】

19、【列表】

20、【属性】命令4、插入水平线选择菜单【插入】

21、【HTML】

22、【水平线】命令，3.3图像的插入和编辑3.3.1网页中常见的图像格式3.3.2插入图像3.3.3设置图片的属性3.3.4编辑图像3.3.1网页中常见的图像格式1、GIF格式GIF是一种索引颜色的图像格式。GIF格式的特点是压缩比高，磁盘空间占用较少，可以同时存储若干幅静止图象进而形成连续的动画。适用于导航条、按钮、图标、透明图像和动画。2、JPEG格式JPEG是支持32位颜色图像，可以保持原图像的真实颜

23、色。JPEG适合网页中对图片质量要求较高，有颜色渐变、需要精确色彩显示的图片，如照片。3、PNG格式PNG是一种新兴的网络图像格式，是目前保证最不失真的格式，它汲取了GIF和JPG二者的优点；PNG还支持透明图像的制作。PNG的缺点是不支持动画应用效果3.3.2插入图像1、插入图片插入图片的方法:（1）打开需要加入图片的网页后将光标放置在文档窗口需要插入图像的位置，然后鼠标单击常用“插入”工具栏的“图像”按钮。如下图插入图像按钮（2）鼠标拖动：在“文件”面板的文件夹中找到需要插入的图片后，用鼠标拖曳该图标到网页文档窗口中。

24、（3）选择菜单【插入】

25、【图像】命令。2、图文混排设置图片的对齐方式：选中图片，在“属性”面板中“对齐”下拉列表框选择图片的对齐方式。说明：如果需要文字环绕图像可选择对齐方式中的“左对齐”或“右对齐”。3、插入图像占位符方法如下：选择菜单【插入】

26、【图像对象】

27、【图像占位符】单击“插入”工具栏中“图像”