网页设计上机练习2 HTML语言的使用.docVIP

网页设计上机练习2 HTML语言的使用 在试卷文件夹中将“lpfd2”文件夹改为(姓名)如()命名的strike等： 总结：以上我们试验了用记事本，通过最原始的方式来生成html文件。下面我们用dreamweaver 来生成和查看html代码。 （必做）用dreamweaver来生成和查看代码。 回到dreamweaver， 并创建站点指向我们的文件夹。如果前面已经创建好了就直接进行下面操作： 新建一个“基本页” ，在上面写上下面三句话，并写上标题： 在“查看”菜单中选择“代码和设计”，如下图： 请在代码窗口中查看dreamweaver自动生成的代码。 试一试在设计窗体中给文字设置成24号、蓝色、加粗。再在代码窗体中查看生成的代码。 保存文件为a2.html 在设计窗体中插入图像（在sc文件夹中的a1.gif），并在代码页中查看它的代码。 在设计窗体中写上“转到a1.html”，并给它设置一个链接到a1.html，操作如下图： 提示：先选中“转到a1.html”，在下面的属性的“链接”中选择a1.html 保存并预览，点击“转到a1.html” 字样，查看转向情况。并回到代码窗口查看代码。 在网页中添加一个三行三列的表格，并在里面插入一些图片和字，查看HTML代码。注意表格table， 单元格td， 表行tr的代码： （必做）下面用一个表格设计的例子来说明，在dreamweaver中修改html语句代码的重要性。 要求制作下面网页的效果，重点制作上面的标题，相关图片在sc文件夹中，分别是：a3_1到a3_9，表格背景图片是bg.jpg 在dreamweaver创建一个基本页，保存为a3.html。在该页面插入一个一行9列的表格，边框设为0，分别插入sc文件夹中的a3_1到a3_9图片，并写上下面的说明文字。看是否表格对得齐，效果是不是不理想。 下面通过修改代码的方式让表格单元格显示工整： 选中每一个图片，在代码窗口上，将它们的宽度width和高度heigh统一为64和47,如下图： 然后在前面的一个单元格标志td，将它们的宽度width和高度heigh统一为73和62，并把对齐统一为顶端对齐top，如下图。 注：中间的“MTV主题站”那一格不需要设置。 再找到表格代码标志table ，点击这一行，修改标志table 的属性代码，如下图： 背景图片为bg.jpg： 效果如下图： 将剩下的网页部分完成。（如何将MTV主题站几个字对齐中间？可以使用一个三行一列的表格，将MTV主题站几个字放在第一行，再居中对齐）。中间行空前，第三行输入下面的相关文字，如下图： 总结：上面的表格设置例子，说明了在dreamweaver中如何在设计和html代码窗口之间综合操作。一个优秀的网页设计师，通常要能设计和代码页同时使用，才能达到网页设计的最佳效果。 四、参考书本P38——2.3 HTML的高级实例，制作一个具有滚动显示的图片和字幕的效果，图片和文字自定，保存网页为a4.html。 换行标记