Chapter3制作网页内容.pptVIP

* 网页设计与制作实用教程 （Dreamweaver+Flash+Photoshop） 2013 . 3 第3章 制作网页内容 文字和段落在网页中的应用 图像在网页中的应用 多媒体对象在网页中的应用 超级链接 文字、图像、动画、声音和视频是网页中常见的对象，它们构成了网页的基本内容。Dreamweaver提供了功能强大的可视化设计工具，可以对这些网页对象进行编辑和处理。 本章主要内容： 3.1 文字和段落在网页中的应用 文字是网页的主体，传达各种各样的信息，浏览者主要通过文字了解网页的内容。本节介绍在网页中应用文字、设置文字和段落格式的方法。 3.1.1 插入文字 3.1.2 设置文本格式 3.1.3 设置段落格式 3.1.4 设置文本样式 3.1.5 使用段落列表 3.1.1 插入文字 在网页中插入文字有3种方法：直接输入、粘贴剪贴板中的文字、导入Word文档。 1．直接通过键盘输入 2．粘贴剪贴板中的文字 3．导入Word文档 3.1.2 设置文本格式 1．设置文本格式 默认情况下，Dreamweaver使用 CSS 设置文本格式。可以更好地控制网页设计。Dreamweaver的格式设置命令会将规则嵌入到当前文档中。若使用HTML标签而不是CSS，则必须更改Dreamweaver的默认文本格式设置首选参数。方法如下。 编辑－首选参数－打开“首选参数”对话框 常规类别－编辑选项，取消选中“使用CSS 而不是HTML标签”复选框。 3.1.2 设置文本格式 2．设置文本字体 首次打开Dreamweaver CS3的字体列表，里面只有很少几种汉字字体，需要用户自己添加。 选择需要改变字体的文本－属性面板－字体下拉列表－编辑字体列表－在可用字体列表框中，选择需要的字体，将其添加到左侧的列表中－确定，在字体列表中即有所选的字体 3.1.2 设置文本格式 3．设置文字大小 选中所需文字－属性面板－大小－选择 右边的单位选择框，可设置像素(px)、点数(pt)、厘米(cm)等9个单位选项。默认用像素为单位 也可在“大小”列表框中直接输入数字 3.1.2 设置文本格式 4．设置文本颜色 选中文本，属性－文本颜色－调色板－选择 或者用“系统颜色拾取器”，自己调配颜色 3.1.3 设置段落格式 段落分明，便于阅读，页面整洁、大方 1．设置文本标题 HTML的标题标签是h1/h1、h2/h2...等 在设计视图中，通过“属性”面板设置 光标定位在要设置标题的段落 单击“属性”面板“格式”右侧的下三角按钮，在弹出的列表框中选择 提示：取消设置好的标题格式，在“属性”面板的“格式”列表框中选择“无” 3.1.3 设置段落格式 2．设置段落对齐 居左、居右、居中和两端对齐 3．段落间距和换行标签 在设计视图中，在文本中光标定位，按下Enter键：硬回车；Shift +Enter软回车 在代码视图，可看到相应的br/标签，这是一个换行标签，p标签是段落标签 3.1.4 设置文本样式 用【属性】面板设置文本格式时，Dreamweaver会跟踪每个文本元素的属性，并使用如下命名约定为每个元素指定一个标识：Style1、Style2、Style3、Stylen。如果为两个以上文本元素指定相同的格式属性，Dreamweaver将使用相同的标识。 之后再使用相同的文本属性设置，只需在属性的“样式”列表框中选择。 可根据需要样式重命名。 提示：Style1、Style2、Style3等标识就是CSS样式名 3.1.5 使用段落列表 列表是HTML中组织多个段落文本的一种方式，列表分成编号列表和项目列表，前一种列表用数字顺序为列表中的项目进行编号，后一种列表则在每个列表项目之前使用一个项目符号。 编号列表 项目列表 3.2 图像在网页中的应用 图像是网页中最常用的元素，制作漂亮的网页离不开图像元素。网页中的图像可用Fireworks或Photoshop这样的专业图像处理软件进行编辑，再插入到Dreamweaver中对网页进行修饰和美化。 3.2.1 插入图像 3.2.2 设置图像属性 3.2.1 插入图像 下面结合实例介绍在网页中插入图像和插入图像占位符的方法。 1．插入图像 使用工具栏或者菜单 2．插入图像占位符 临时代替图像，占位用 3.2.2 设置图像属性 在网页中插入图像以后，用“属性”面板设置图像的属性 图像：在图像ID文本框中输入一个名称，以便在有些情况下（如脚本语言）可以引用该图像。 宽、高：以像素为单位精确指定图像尺寸。在页面中插入图像时，Dreamweaver会自动