深圳大学
实验报告
课程名称：网页设计与制作
实验序号：
实验名称：图文混排网页制作
班级：临床一班姓名：张
同组人：实验日期：2014 年4月21 日
教师签字：
一、实验目的
(1)掌握网页布局的方法。
(2)掌握在网页中插人图片的方法。
(3)掌握网页中图文混排的排版方法
二、实验环境
制作秋天的思念网页效果
三、实验步骤
(1)新建html，在页面属性中设置，背景颜色设置为“#313884” ,页面标题设置为“秋天的思念”。如下图
(2)插人一个3行1列的表格,将表格宽度设置为“558”像素.边框扭细、单元格边距、
单元格间距均设置为“0”像素,如图所示。鼠标右键可以再自动弹出的“属性”面板中设置表格的对齐方式为“居中对齐”。
(3)在“代码”视图中使用代码将第1行单元格的背景设置为图片“bg.gif”（光标插到在
并设置为左对齐,效果如图所示。
(4)将第2行和第3行单元格的背景颜色均设置为“#FFA200” ,在第3行的单元格内插人图片“blank.gif” ,并将其宽度设置为“1”像素、高度设置为“10”像素。
注意:blank.gif是一个宽和高均为1像素的透明图片,在网页制作中经常利用这种透明图片来
“撑开”表格,使其处于固定的宽度和高度。
(5)在第2行单元格内插人一个1行、3列的表格,将其宽度设置为100%,边框粗细、单元格边距、单元格间距均设置为“0”像素,对齐方式设置为“居中对齐”。
(6)在新插人表格的第2列单元格内插人图片“autu.jpg” ,将第1列至第3列单元格的宽度分别设置为2%、96%、2%,同时单击代码视图,将第1列和第3列单元格内的“ ”删除,效果如图5-4所示。