1 / 32

第 5 章 网页制作基础

第 5 章 网页制作基础. 5.3 编辑网页. 文本编辑 表格使用 图像应用 多媒体的应用 页面属性设置. 5.3 编辑网页. 文本编辑 输入文本内容 设置文本格式 文本拼写检查、查找和替换 表格使用 插入表格 （ 导入表格 ） 编辑表格 选定 、 插入行列 、 删除行列 、 合并拆分 、 移动复制 、 表格大小 格式化表格 设置表格属性. 图像应用 插入图像 （ 图像占位符 、 鼠标经过图像 ） 编辑图像 （使用属性检查器） 多媒体的应用 插入 Flash 动画 插入 Flash 文本 插入 Flash 按钮 插入 Flash 视频

roth-pittman
Download Presentation

第 5 章 网页制作基础

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. 第5章 网页制作基础

  2. 5.3 编辑网页 • 文本编辑 • 表格使用 • 图像应用 • 多媒体的应用 • 页面属性设置 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础

  3. 5.3 编辑网页 文本编辑 输入文本内容 设置文本格式 文本拼写检查、查找和替换 表格使用 插入表格 （导入表格） 编辑表格 选定、插入行列、删除行列、合并拆分、移动复制、表格大小 格式化表格 设置表格属性 图像应用 插入图像（图像占位符、鼠标经过图像） 编辑图像（使用属性检查器） 多媒体的应用 插入Flash动画 插入Flash文本 插入Flash按钮 插入Flash视频 页面属性设置 （属性检查器“页面属性”按钮） ①“插入”工具栏“常用”② “插入”/“媒体” 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础

  4. 5.3.1 文本编辑 • 输入文本内容 • 添加文本 • Enter、Shift＋ Enter • 输入多个空格： • 代码窗口输入 “&nbsp”，复制多个 • “编辑”/“首选参数”/“常规”分类/“允许输入多个连续的空格”复选框 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础

  5. 5.3.1 文本编辑 • 输入文本内容 • 插入特殊符号 • 插入工具栏 ：文本 • 插入水平线 • 插入工具栏 ：HTML • 插入日期 • 插入工具栏 ：常用/日期 • 移动和复制 • “剪切”、“复制”和“粘贴” • 导入Word文档 • 文件/导入/Word文档 返回 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础

  6. 5.3.1 文本编辑 • 输入文本内容 • 添加文本 “编辑”/“首选参数” 添加空格 Shift+Enter换行 Enter换行 返回 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础

  7. 5.3.1 文本编辑 • 插入特殊符号 • 选择“插入”工具栏中的“文本”选项卡，单击“字符”按钮旁边的下拉箭头，在弹出的菜单中选择要插入的字符。 插入工具栏 ：文本 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础

  8. 5.3.1 文本编辑 • 如果没有要插入符号，选择“其他字符”选项，在弹出的“插入其他字符”对话框中选择字符。 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础

  9. 5.3.1 文本编辑 • 由于文档编码方式不同，某些特殊字符可能不能显示出来， 此时会出现警告信息对话框，单击“确定”按钮。 • 在设计视图中选定特殊符号，设置为西文字体，即可显示相应的符号。 返回 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础

  10. 5.3.1 文本编辑 插入工具栏 ：HTML • 插入水平线 “插入”/“HTML”/“水平线” 属性检查器 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 返回

  11. 5.3.1 文本编辑 • 插入日期 • 选择“插入”/“日期”命令，或者在“插入”栏的“常用”选项卡中单击“日期”按钮，打开“插入日期”对话框。 ①插入工具栏 ：常用/日期 ②“插入”/“日期” 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 返回

  12. 5.3.1 文本编辑 • 移动和复制 • 选定 －“编辑”/“剪切”“编辑”/“粘贴” • 复制：“编辑”/“拷贝”“编辑”／“粘贴”命令。 返回 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础

  13. 5.3.1 文本编辑 • 导入Word文档 导入Word文档时，可以选择导入的格式： • 仅包含文本内容 • 带有段落、列表和表格等结构 • 带有基本格式、全部格式 “文件”/“导入”/“Word文档” 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础

  14. 先新建网页 单击… 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 返回

  15. 5.3.1 文本编辑 • 设置文本格式 • 设置文本字体 ★属性检查器 ⑤ ④ ⑥ ⑦ ② ③ ① ⑧ ★“文本”菜单 返回 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础

  16. 5.3.1 文本编辑 • 设置文本格式 • 设置文本字体 • 选中 --“字体”下拉列表； “文本”/“字体”子菜单 • “字体”下拉列表中列出的是由多种字体构成的字体组合。浏览网页时，浏览器按组合中的字体顺序在用户计算机系统上进行查找并显示字体。 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础

  17. 5.3.1 文本编辑 • “字体”下拉列表选择“编辑字体列表”选项，打开“编辑字体列表”对话框，从中添加或修改“字体”下拉列表中的字体组合。 “字体”下拉列表选择“编辑字体列表” 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 返回

  18. 5.3.1 文本编辑 • 设置文本大小 • 选定文本 ，“大小”下拉列表中选择 • 设置文本大小有两种方式： • 用数值来设置文本的绝对大小。 • 设置文本的相对大小：极小、特小、小、中、大、特大、极大、较小、较大等。 用浏览器查看网页时，用数值设置大小的文本能保持设计时的大小； 设置相对大小的文本将随着浏览器的设置而改变文本的大小。 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 返回

  19. 5.3.1 文本编辑 • 设置文本颜色 • 单击属性检查器中的“文本颜色”按钮 • 单击“调色盘”按钮，出现“颜色”对话框 • 选择“文本”/“颜色”命令 ，出现“颜色”对话框 “调色盘”按钮 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 返回

  20. 5.3.1 文本编辑 • 设置文本的其他格式 • 选定文本后，选择“文本”/“样式”子菜单中：粗体、斜体、下划线、删除线、打字型、强调、加强等命令。 • 属性检查器中“粗体”按钮和“斜体”按钮。 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 返回

  21. 5.3.1 文本编辑 • 编排段落格式 段落格式包括段落的对齐方式、段落的缩进和突出 标准格式，用于统一设置段落中字符的大小和颜色 段落格式作用于整个段落，因此不必选定整个段落的内容，只要将插入点定位于段落中的任何位置，设置的格式将会作用于整个段落。 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础

  22. 5.3.1 文本编辑 • 应用标准格式 • Dreamweaver提供了多种标准格式，它包括：“段落”、“预先格式化的”、“标题1”……“标题6”等。 • 定位于段落中，在 “格式”下拉列表中选择 • “文本”/“段落格式”子菜单中列出的标准格式。 返回 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础

  23. 5.3.1 文本编辑 • 设置对齐方式 • 段落的对齐方式有：左对齐、居中对齐、右对齐和两端对齐。 • 单击属性检查器中的对齐按钮 • “文本”/“段落格式”子菜单中的对齐格式。 返回 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础

  24. 5.3.1 文本编辑 • 文本缩进和突出 • 文本缩进：将整个段落的左右边界分别向中央缩进一段距离； • 文本凸出：将段落的左右边界向外扩展一段距离。 • 单击属性检查器中的“文本缩进”按钮和“文本突出”按钮； • 选择“文本”/“缩进”和“突出”命令； • 按Tab键，设置段落缩进。 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 返回

  25. 5.3.1 文本编辑 • 制作列表 列表分为两种：项目列表和编号列表。 文本缩进 项目列表 Shift+Enter换行 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础

  26. 5.3.1 文本编辑 • 项目列表 • 单击属性检查器中的“项目列表”按钮； • 选择“文本”/“列表”/“项目列表”命令。 • 项目列表是作用于段落的，因此项目符号仅显示在段落的开头。 • 改变列表的层次：单击属性检查器中的“文本缩进”按钮和“文本突出”按钮。 • 清除项目列表形式：再次单击“项目列表”按钮，或选择“文本”/“列表”/“无”命令。 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础

  27. 5.3.1 文本编辑 • 编号列表 • 单击属性检查器中的“编号列表”按钮； • 选择“文本”/“列表”/“编号列表”命令。 • 改变编号列表的层次：设置文本的缩进和突出 • 清除编号：再次单击“编号列表”按钮，或选择“文本”/“列表”/“无”命令。 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础

  28. 5.3.1 文本编辑 • 修改列表属性 • 默认的项目符号是“●”，编号是“1. 2. 3.”。 • 选择“文本”/“列表”/“属性”命令（若未激活先选一次项目列表），在打开的“列表属性”对话框中可以重新设置列表的外观。 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 返回

  29. 5.3.1 文本编辑 • 文本拼写检查、查找和替换 • 拼写检查 选择“文本”/“检查拼写”命令，便对页面中的文本进行拼写检查。当遇到无法识别的单词时，将出现“检查拼写”对话框。 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础

  30. 5.3.1 文本编辑 • 查找和替换 选择“编辑”/“查找和替换”命令，打开“查找和替换”对话框。 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础 返回

  31. 演示 • 通过“首选参数”修改“默认编码” • 先复制文本内容，再设定格式 • 先消除<br />，再用<p> • 选中文本再设置样式(字体、大小、颜色) • 单击段落再设置缩进，包括项目列表段。 • 通过“首选参数”选中“允许多个连续的空格” • 项目列表中每个项目事先作为一个段落。 • 设置页面背景、页边距 • 插入水平线 • 给标题加上水平线 • 添加版权信息 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础

  32. 作业01——效果如下，素材见elearning 华文中宋，36号，白色 楷体，中号，黄色 隶书，特大号，黄色 方正姚体，中号，白色 华文中宋，中号，黄色 《大学计算机信息科技教程（第二版）》——第5章 网页制作基础

More Related