网页制作技术教程贺军及素材第二章网页制作.pptVIP

①掌握页面的整体控制和头部内容设置的方法。 ②熟练掌握在网页中输入、设置标题和正文文字的方法。 ③掌握在网页中嵌入图像、声音、多媒体信息的方法。 ④掌握建立各种形式超级链接的方法。 ⑤熟练掌握网页页面布局的各种方法。 ⑥掌握制作表单的方法。 ⑦掌握在网页中添加CSS的方法。 ⑧掌握网页特效的制作方法。 ⑨掌握模板和库的使用方法。 ⑩掌握行为的使用方法。 目 录 第一讲 文档及文本操作 第二讲 图像及超级链接 第三讲 媒体及表格 第四讲 框架及图层 第五讲 表单 、模板和库 第六讲 CSS样式 第七讲 行为 第一讲 文档及文本操作 [教学内容] 1 新建空白文档网页 2 设置页面属性 3 保存文档 4 文本的输入及格式 5 列表、水平线等其他元素 6 在网页中插入文件头部内容 [教学重点和难点] 网页文件的建立、页面属性的设置、网页中文本等元素的输入以及文件头部内容的设置 文档及文本操作 2.1 文档操作 2.1.1 新建空白文档网页 2.1.2 设置页面属性 2.1.3 保存文档 2.2 文本操作 2.2.1 在网页中输入文本 2.2.2 设置文本属性 2.2.3 文本换行 2.2.4 插入特殊字符和在字符之间添加空格 2.2.5 使用列表 2.2.6 在网页中插入文件头部内容 2.2.7 插入水平线和时间 2.1.1 新建空白文档网页 新建一个网页文档有两种方法： （1）如果您的Dreamweaver运行后显示起始页，则在起始页中直接选择“创建新项目”下的HTML选项。 （2）如果您的Dreamweaver运行后不显示起始页，则选择“文件”→“新建”命令，弹出“新建文档”对话框，通过该对话框完成新建。 【任务2-1-1】新建空白文档网页 【操作要求】 在站点根目录（D:\root）下建立一个名为index.html的网页 【操作步骤】 （1）启动Dreamweaver后，在文件面板中选择“站点－我的站点”，如图1所示。单击文件面板中的 按钮，在“文件”的级联菜单中选择“新建文件”选项，如图2所示。 【任务2-1-1】新建空白文档网页 【任务2-1-1】新建空白文档网页 （2）在文件面板的“站点－我的站点（D:\root）”文件夹中出现了一个新文件，名称为untitled.html，如图3所示。将其重命名为index.html，如图4所示。 （3）在文件面板中，双击index.html即可在Dreamweaver的文档窗口中打开该网页，对其进行编辑修改。 【任务2-1-1】新建空白文档网页 2.1.2 设置页面属性 在制作网页时，还需要对影响整个页面的参数进行必要的设置。 选择“修改”→“页面属性”命令，弹出“页面属性”对话框，如图5所示。 1．设置外观 2．设置链接 3．设置标题 4．设置标题和编码 5．设置跟踪图像 【任务2-1-2】页面属性设置 【操作要求】在文档窗口中打开D:\root\index.html网页，将网页标题设为“我的主页”，文本字体为“仿宋”，大小为12像素，颜色为#00FF00。 【操作步骤】 （1）在文档窗口中打开D:\root\index.html网页，右击窗口空白处，弹出一个快捷菜单如图6所示，从中选择“页面属性”命令，弹出“页面属性”对话框，如图7所示。 （ 2）在 “分类”列表框中选择“外观”选项，单击“页面字体”下拉列表框查找所需字体，在字体列表中无所需字体则选择“编辑字体列表”，弹出“编辑字体列表”对话框。 （3）在该对话框中的“可用字体”列表框中找到“仿宋”，单击 按钮，则“仿宋”字体添加到了“选择的字体”列表框中。 （4）在“外观”选项中，在“大小”下拉列表框中选择12，在“文本颜色”文本框中输入#00FF00，如图8所示。 （５）在 “分类”列表框中选择“标题和编码 ”选项，在标题对话框中输入“我的主页”，单击“确定”按钮，操作完成。 2.1.3 保存文档 新建一个文件后，选择“文件”→“保存”命令，弹出“另存为”对话框，在 “另存为”对话框选中保存路径，给文件命名，选择保存类型，然后单击“保存”按钮即可完成文件保存。 2.2 文本操作 文本是网页中不可或缺的元素，网页中的文本用来传达网页包含的各种信息与提示。文本的信息量大且生成的文件小，容易被浏览器下载，不会让浏览者用过多的时间等待，因此，不论网页内容如何丰富，文本始终都是网页中的基本元素。同时掌握好文本的使用也是网页制作的基本功。 2.2.1 在网页中输入文本 　　　在网页中输入文本的方法很简单，单击网页中要插入文本的空白区域，窗口随即出现闪动的光标，选