第3章网页图文精要.pptVIP

* （4）回到“页面属性”对话框后，移动鼠标单击 按钮。 网页的背景图会以贴磁砖的方式重复排列来显示（如图所示），所以要注意颜色不能太过鲜艳，以免看不清楚文本或网页上的其他内容，造成反效果。 * 3.3 用CSS样式设置文本格式 在制作网页过程中，每页都会用到文字、图像以及表格、表单等元素。对于这些元素，如果没有CSS样式控制，是无法使页面美观的。各浏览器之间不兼容，也会导致同一个网页在不同的浏览器中显示效果不同，而应用CSS样式则恰到好处地解决了这个问题。Dreamweaver CS4将CSS面板重新设计为一个统一的CSS样式面板，可以快速地创建、编辑和应用样式。 层叠样式表CSS（Cascading Style Sheet）可以用来自定义样式或改变默认样式，提高编辑效率，美化网页。 CSS是W3C（The World Wide Web Consortium）为HTML制定的样式表机制，并得到微软公司和网景公司的支持，因而CSS样式在IE4（Internet Explorer4.0）和NC4（Netscape4.0）以上的浏览器中均可支持，只是有些效果需要更高版本的浏览器支持。 * 3.3.1 新建CSS样式 1、新建特定标签CSS样式 2、新建任何标签的CSS样式 3.3.2 编辑CSS样式 3.3.3 应用CSS样式 * 3.4 项目实训 3.4.1项目一 1.实训题目 “长城—世界建筑史上一大奇迹”网页 2.实训目的 通过制作该网页作，可以掌握文本的标题设置、文字的移动和复制、文字的查找与替换等基本设计过程。 * 3.实训案例效果 * 3.4.2项目二 1.实训题目 “中国名胜—故宫”网页 2.实训目的 通过制作该网页作，可以掌握图像加载、移动、复制、删除和属性设置等基本设计过程。“中国名胜—故宫”网页的显示效果如图所示。 * 3.实训案例效果 * 3.5本章小结 图像和文本是网页中不可缺少的基本元素。文本自始自终都是网页中最基本的元素，而网页中有了图像会显得更加生动、简洁，起到美化网页的作用。无论是个人网站还是企业网站，图文并茂的网页会为网页增色不少，通过图像美化后的网页能吸引更多浏览者。本章介绍了文本和图像的基本操作，例如插入文本和图像、文本和图像的属性设置、列表设置、图文混排以及CSS样式表等，能使读者全面了解和掌握网页图文的使用方法和技巧。 * 第3章 网页图文 教学任务： 输入文本和文本编辑 插入和编辑图像、图文混排 用CSS样式设置文本格式 教学重点与难点： 图文混排 用CSS样式设置文本格式 * 文本是大多数网页的主要内容，Dreamweaver CS4提供段落文本的基本工具，可以编排段落、建立与更改项目符号等，能够更随心所欲地安排网页内容。 让网页更加动人的诀窍，在于使用精美的图片帮衬，可将标题做成一张图片，让标题醒目，也可以替网页加上背景图等，如果网页缺少了图片的点缀，那么就会逊色许多。 * 3.1 网页上的文本编辑 3.1.1文本插入与编辑 1.文本的插入 文本是网页的最基本元素，在Dreamweaver中除了可以直接输入文本，还可以从外部导入文本文件。 利用导入功能，加载现存的文本文件， 可以大大的提高工作效率。 以下是将文本文件置入网页中的操作步骤： ②移动鼠标到菜单栏执行【文件】→【打开】命令，选择并打开所需的文本文件。如图3-1所示。 * 提示：在【文件】面板中双击相应的文本文件也可打开。 * ②Dreamweaver会自动打开纯文本格式的文本文件，接着执行菜单栏【编辑】→【全选】命令。如图所示。 * ③选取文本后，执行菜单栏【编辑】→【拷贝】命令。 ④切换至编辑窗口后，移动鼠标到菜单栏执行【编辑】→【粘贴】，将复制的文本粘贴到网页上。 除了导入文本文件外，若看到别人的网页内容，有可以借鉴的，也可以利用复制HTML与粘贴HTML功能，把那一段文本连同格式复制过来。 * 2.文本的编辑 网页上的段落文本分为： 有项目符号。 没有项目符号。 分隔段落文本有两种方法： 按【Enter】键分段会造成较大行距的段落间距。 按【Shift+Enter】键则只是换行而已。 （1）编排文本段落 ①将光标移到要分段的位置后，按下【Enter】键。 * ②当按下【Enter】键时，则会造成较大行距的段落。如图所示。 * 若按下【Shift】+【Enter】键，则只是强迫文本换行而已。如图所示。 * （1）修改文本颜色与字体 ① 移动鼠标选取文本后，打开【属性】面板，在“格式”列表中选择标题1，接着在“字体”列表中选择“编辑字体列表”。 ②出现【编辑字体列表】对话框后，在“可用字体”列表中选择要置入的字体，接着单击