实验四 网页制作和发布.docVIP

实验四 网页制作及发布 实验目的： 学习并掌握简单的网页制作方法。 实验环境： Windows XP SP2 Dreamweaver 8 中文版 实验步骤： 下载Dreamweaver 8 绿色版并解压到本地文件夹。 下载地址： HYPERLINK /~lding/ /~lding/ 先双击注册软件信息，然后双击进入Dreamweaver 8程序界面。 文件- 新建打开如下对话框： 选择类别中的基本页，基本页中的HTML，单击创建。 选择下图中“设计”对网页进行编写。 标题：修改为网页名称。 在网页中添加文字： 在文档中输入文字，全选后通过下方属性修改字体的大小颜色对齐等属性，或者全选要修改的字体后单击右键进行修改。 添加超链接： (名词解释：超链接是一种对象，它以特殊编码的文本或图形的形式来实现链接，如果单击该链接，则相当于指示浏览器移至同一网页内的某个位置，或打开一个新的网页，或打开某一个新的WWW网站中的网页。) 全选该文字后单击右键选择创建链接，或者选择右下角链接栏。 单击中按键会出现如下对话框： 链接文件：在查找范围中选择本地硬盘中的文件后，单击确定。 链接URL：在下面URL文本栏中输出地址，并单击确定即可。 添加图像：选择 插入-图像 选择指定图片，或者将网络图片的URL地址添加到URL框中，单击确定。 选中图片后在下方属性中修改： 宽、高用于修改图片大小、源文件修改图片来源、链接用于添加图片的超链接、垂直和水平边距用于修改图片距离网页最上和最左的距离、对齐和边框用于修改图片对齐属性和边框大小。 页面属性修改： 在网页空白处单击右键选择页面属性。 外观： 页面字体：定义页面中的默认文本字体。 大小：定义页面中默认的字体大小。 文本颜色：定义页面中默认的文本的颜色。 背景颜色：定义页面背景色。 背景图像：可以输入用作HTML文档背景图像的路径和文件名称。单击后面的浏览按钮，可以从磁盘上选择图像文件。 左、右、顶部、底部边界：设置页面元素同页面边界的间距。 链接选项是一些与页面的链接效果相关的设置： 链接字体：定义页面超链接文本在默认状态下的字体。 大小：定义超链接文本的字体大小。 链接颜色：定义超链接文本默认状态下的字体颜色。 翻转链接：定义鼠标放在链接上时，链接所显示的颜色。 访问过的链接：定义访问过的链接的颜色。 活动链接：定义活动链接的颜色。 下划线样式:定义链接下划线的样式。 插入对象： 特殊字符：插入-HTML-特殊字符。 日期：插入-日期。 水平线：插入-HTML-水平线。(用于分开文字与图片使界面更加美观) 表格：插入-表格。 简单用法如下： 背景音乐：插入-媒体-插件 在弹出对话框中选择音源并确定。 插入FLASH动画：插入-媒体-FLASH视频。 行为： 在右边栏中找到“行为”的选项框。 选择指定图片后单击添加行为。 交换图片：在设定原始档中添加指定的图片目录。（选中图片与指定图片交换） 弹出信息：在消息框中添加文字。（单击弹出消息对话框，显示指定文字） 打开浏览器窗口。 播放声音。（播放指定声音片段） 转到URL。 设置好对应的行为后，在浏览网页中单击该图片或文字指定事件发生。 框架与层： 框架是网页制作中常用的设计方式之一。框架可以将一个浏览器窗口划分为多个区域，每个区域都可以显示不同的HTML文档。每个框架区域也都可以用单独的滚动条，在浏览一个框架时并不影响另一个框架的显示内容。 插入-HTML-框架 根据名称选择插入框架的位置。 查看-可视化助理-框架边框 页面四周将显示出框架的边框线。 修改-框架页 或 用鼠标拖动文档窗口四周显示的框架边框。 支持动态HTML是Dreamweaver 8最突出的特点，即可以通过层实现文档内容在网页中的精确定位。层在网页中的位置可以任意放置，用户可以将图像、文字等元素放到层中，这样就可以达到网页元素的精确定位。 插入-布局对象-层，层属性的修改基本类似于图片。 预览并保存。 文件-另存为：保存网页至指定目录。 文件-在浏览器中预览-IExplore 7.0：预览网页于浏览器。 在个人主页上发表： 在个人的FTP上建立Public_html文件夹。 将制作好的的网页更名为index.html并上传至Public_html文件夹下。 将网页用到的所有素材图片包括文件一起放到Public_html文件夹中。(注：制作时应将素材放置于index.html同目录) 在浏览器中输入 HYPERLINK /~ /~+名字，浏览自己的个人主页。 实验内容： 制作简单的个人主页，其中应该包括主页的名称、文字、图片、一些超链接，最好再添加一些音乐背景及其它效果使得其更加美观。 实验提交： 本实验 HYPERLINK mailto:完成后提交主页地址到lding@ 完