在页中使用表格文字和图片实训教案.docVIP

在网页中使用表格、文本和图片 本节课案例效果图： 一、新建站点 在Dreamweaver中新建站点，站点名自定，在站点文件夹中新建文件夹images，用来存放网页需要的图片素材，新建文件index.html作为网站的首页，并开始编辑网页。（该步骤不熟悉这参考第一周实训教案） 二、index.html网页的编辑 1、添加网页的背景图片 单击【属性检查器】中的【页面属性】 在打开的窗口中，通过【浏览】设置网页的背景图像为images文件夹中的background.gif图片。如下图所示： 2、使用表格对网页进行布局 1）插入4行1列的表格 （1）在菜单【插入】中选择【表格】按钮，如下图所示： （2）在下边的窗口上进行相应的设置，如下图： 注意：该表格是用来布局页面的，是控制页面中的内容在适当的位置显示的，不是我们用来填数据的表格，所以这里表格的边框粗细设置为0，这样的话表格看上去是隐藏的，不会影响页面的美观性。在这里我们为了编辑的方便可以先设置为1像素的边，最后完成网页后再修改为0。 运行浏览效果为： 我们会发现表格式默认居左的，接下来我们设置表格在整个网页中居中，将光标放在表格的边上单击一下选中整个表格，然后在【属性检查器】中将【对齐】方式设置为【居中对齐】方式。如下图所示： 接下来我们运行查看结