网站设计开发课件-第五讲-兰州JQ-网页文本及媒体的应用.pptVIP

?本节知识点　　插入文本，输入空格、特殊字符及日期　　格式化文本 　　设置文本的属性　　项目列表的应用 　　插入多媒体对象 ?本节提纲3.2.1 案例：制作简单的“睡美人”网页3.2.2 文本的编辑操作3.2.3 插入多媒体对象3.2.4 上机实训  3.2.1 案例：制作简单的“睡美人”网页　　制作简单的“睡美人”网页，在页面中插入文本、图像、水平线、日期、背景及空链接等。其效果图如图3-29所示。 ?实战步骤　　(1) 创建站点及首页文件。 　　(2) 输入文本内容，设置字体。　　 将光标放在段首，每个段落的开头空两格。文本面板设置为不换行空格。设置效果如图3-30所示。 　　(4) 设置背景和标题。　　① 在“属性”面板中选择“页面属性”，在弹出的对话框中选择“背景图像(00111.jpg)”或“背景颜色”。　　② 在“属性”面板中选择“页面属性”中的“标题/编码”→“标题”命令，输入标题的内容，如图3-32所示。 3.2.2 文本的编辑操作　　1．输入文本　　1) 插入普通文本 　　2) 插入特殊字符 　　3) 在字符之间添加空格  　　(1) 将中文输入法切换到全角模式，按一下空格键则输入一个全角的空格。在属性面板的“格式”列表中选择“预先格式化的”选项后(如图3-35所示)，则可以按空格键输入空格。　　(2) 使用快捷键Ctrl + Shift?+?空格键输入空格。　　4) 文本的换行 　　(1) 将光标定位在需要换行的位置。　　(2) 单击插入栏“文本”类别中的“换行符”按钮，或按快捷键Shift + Enter，即可在该位置插入一个换行符，从而使两段之间的距离和正常行距一样。 　　3．格式化文本 　　文本格式一般包括文本的字体、字号、颜色及对齐方式等。通常可通过文本的“属性”面板来设置，如图3-39所示，在文档窗口中可以看到效果。只是在进行字体的设置时，先要在“字体列表”框中选择“编辑字体列表”，然后选择要添加的字体，如图3-40所示。 3.2.3 插入多媒体对象　　1．网页图像的基础知识　　1) 网页图像格式　　2) 颜色基础　　2．插入图像　　图像可以直接插入在页面中，也可以在表格、表单或层中插入。应用层还可以使图像交叠。　　使用以上任一种方式时都会出现“选择图像源文件”对话框，在其中选取所要插入的图像文件，如图3-41所示。然后单击“确定”按钮，则将选中的图像插入到指定的位置。 3.2.4 上机实训 【实训要求】　　制作一个简单网页“我的美丽家乡”。　　在页面上输入文本内容。　　设置标题及文本的格式。　　插入背景颜色或背景图像。　　插入图像、鼠标经过图像、水平线、日期及Flash的动画效果。 【实训目的】　　了解Dreamweaver 8中格式化文本的设置。　　掌握网页中的效果设置。　　能够独立完成简单网页的制作及预览。 图3-45 “插入Flash按钮”对话框 　　(3) 在“按钮文本”文本框中输入文字，然后选择样式，确定字体、大小、链接等操作。　　(4) 单击“确定”按钮，完成设置并返回编辑窗口。　　(5) 此时文档中将出现一个Flash按钮，按钮的属性可通过“属性”面板来调整。　　2) 插入Flash文本对象　　(1) 将光标放在要插入Flash文本的位置。　　(2) 单击“常用”插入栏中媒体按钮旁的下拉按钮　　，在打开的下拉列表中选择“Flash文本”，弹出“插入Flash文本”对话框，如图3-46所示。 图3-46 “插入Flash文本”对话框 　　(3) 在“文本”框中输入文字“欢迎光临我的网页”。　　(4) 设置文字格式：大小、字体、粗细、倾斜、对齐方式等。　　(5) 设置文字的颜色、转滚颜色和背景颜色。　　(6) 设置文字内、外的链接方式以及当前的保存路径等。　　3) 插入Flash动画　　(1) 将光标放在要插入Flash动画的位置。　　(2) 单击“常用”插入栏中媒体按钮旁　　的下拉按钮，在打开的下拉列表中选择“Flash命令”，弹出“选择文件”对话框，如图3-47所示。 图3-47 插入Flash动画对话框 　　(3) 在“查找范围”下拉列表框中选择要插入的Flash动画文件，如图3-47所示。　　(4) 单击“确定”按钮，页面上出现Flash动画文件标志，如图3-48所示。　　(5) 选中此对象，在“属性”面板中设置它的高度和宽度，然后单击“属性”面板上的“播放”按钮　　　　预览效果。 图3-48 Flash标志 第3章 Dreamweaver 8网页制作基础 梦想 . . . 编 织 Web 西安电子科技大学 贺华