网页设计——期末练习教程.doc

实训1 页面控制 实训目的 为了让学生能熟练掌握创建站点的方法，掌握设置网页的页面属性、如何在网页中添加背景音乐等操作。 素材准备 准备制作网页所需的文字素材、图像素材、音乐素材。 实训内容 创建站点： 设置外观： 设置标题： 设置标题/编码： 设置跟踪颜色： 设置颜色： 设置窗口大小： 添加背景音乐： 实训要求 实训步骤 在E盘中新建本地根文件夹，命名为root，并在该文件夹中新建image文件夹以存放网站中所要用到的图片。 定义站点：设置 站点名称，命名为 mysite;设置本地根文件夹,指定为E盘下的root文件夹;设置 HTTP地址为localhost。 创建与设置文档的页面属性：?新建一个页面，设置文档页面属性：标题设置为我的班级，背景图像设置为image\ 0l.jpg图像，左边界、边界宽带、顶部边界以及边界高度分别设置为20 设置页面中文字的字体、字体大小：选择文字部分，在属性面板设置字体及字体的大小。 添加背景音乐：为整个页面添加一个背景音乐。在代码视图下在body和/body之间如下添加代码：embed src=01.mp3 hidden=true autostart=true 保存文件，预览文件效果。 实训过程注意事项 在创建站点的过程中注意建立本地文件夹，文件夹命名最好为英文；网站中所有的文件最好取名为英文；注意文件的路径； 所有的图片文件单独放在image文件夹内。 背景音乐必须放在站点文件内。 页面效果图 图1-1 实训2 文本操作 实训目的 为了让学生能熟练掌握在Dreamweaver中如何输入文本，调整设置文本的格式；如何插入特殊字符、文本列表、水平线、时间、注释的方法。 素材准备 准备制作网页所需的文字素材、图像素材、音乐素材。 实训内容 输入文本： 调整文本： 插入特殊字符： 插入文本列表： 插入水平线： 插入时间： 插入注释： 设置文本格式： 实训要求 要求学生掌握在Dreamweaver中输入文本、设置文本格式、插入特殊字符、项目符号等操作。 实训步骤 打开上次实训所做的页面文件； 输入文本，调整文本的间距，设置文本的格式；通过“属性”面板中的“格式”和“颜色”等参数，将文字设为标题格式，并改变其颜色； 输入一段不带格式的文字，选择“常用”工具栏上的“文本”单选项目，利用换行按钮对文本进行换行处理，实现分段的效果； 插入特殊字符、项目符号、水平线、时间、注释等内容； 实训过程注意事项 在“编辑字体列表”对话框中选择要添加的字体要一个个地添加进去，不能全部选取再添加； 当输入文本时要插入多个连续的空格，必须要“编辑”菜单下的“首选参数”中设置； 换行的几种方式：自行换行；按ENTER强行换行；按SHIFT+ENTER换行操作； 页面效果图 图1-2 实训3 图像操作 实训目的 为了让学生熟练掌握在Dreamweaver中插入图像，学会设置图像属性；如何插入鼠标经过图像、插入图像占位符的方法，掌握图文混排的技巧等操作。 素材准备 准备制作网页所需的文字素材、图像素材、音乐素材。 实训内容 插入图像： 设置图像属性： 插入鼠标经过图像： 插入图像占位符： 图文混排操作： 实训要求 要求学生掌握在Dreamweaver中如何插入图像、设置图像的格式；如何插入鼠标经过图像、图像占位符；掌握图文混排等操作。 实训步骤 打开上次实训所做的页面文件； 插入图像，在属性面板对图像的格式进行设置； 插入鼠标经过图像、图像占位符； 将图片和文字进行混合排版； 保存文件，预览文件效果； 实训过程注意事项 插入的图像必须放在站点文件夹下的image文件夹内； 设置图片的热点区域可选任意的工具； 图1-3 实训4 表格布局 实训目的 为了让学生熟练掌握在Dreamweaver中插入表格，学会设置表格的各项属性；并掌握如何在表格中插入文本、插入图像的操作方法和步骤。 素材准备 准备制作网页所需的文字素材、图像素材、音乐素材。 实训内容 插入表格，并选择表格和单元格： 设置单元格属性： 调整表格结构、大小： 格式化表格： 表格中插入文本，表格中插入图像： 实训要求 要求学生掌握在Dreamweaver如何插入表格、设置表格和单元格的格式；如何调整表格的结构大小；掌握表格中如何插入文字及图像等操作。 实训步骤 新建一个页面，在页面中插入一个6行7列的表格，并在其中输入相应的文字； 选择表格利用“格式化表格”命令来对表格格式进行修改，使其更美观； 根据要求对部分单元格进行拆分或合并操作； 设置文字的对齐方式，通过对边框、填充和间距进行设置； 保存文件，预览文件效果； 实训过程注意事项 插入表格时要注意：单元格的边距和单元格的间距值的设置； 表格边框线精细为0像素的特殊用途； 插入的图像必须放在站点文件夹下的image