文档介绍：实验HTML与态网页————————————————————————————————作者:————————————————————————————————日期: 实验3-1站点首页的设计【实验目的】1、了解HTML各种标记语言的作用,以及如何制作一个静态网页2、掌握常用网页制作软件()的使用【实验条件】个人计算机一台,预装Windows2000或WindowsXP操作系统,。【实验说明】在网页示例中,表格t1为网页的头部,放置公司的logo,公司名称,和一些图片等等;t2中的内容为网页的主要内容;t3是网页的尾部,通常显示一些相同的网站版权、经营许可证及网站联系人等信息。推荐学时:1学时【实验内容与步骤】步骤一:分析该公司网站首页,并对其进行设计。以下图中的网页为例图3-1需要制作的网页表t1,t2和t3纵向排列,并在网页中居中显示,其结构如图所示。其中,t2第一行包含表t21,第二行第一列包含表t22,第二列包含表t23,表t21,t22和t23结构如图所示。步骤二:使用Dreamweaver来进行网页制作。1、使用Dreamweaver新建网页后,在设计页面插入表格t1。具体表格的单元格大小见代码。其内容如下:背景图片插入图片插入图片背景图片,并输入公司名称居中显示插入图片2、插入表格t2,具体表格的单元格大小见代码。对整个t2设置背景图片,其它内容如下:团队精神团队介绍公司目标发展方向插入一条水平线,顶部显示背景图片,显示“首页”背景图片,显示“公司简介”背景图片,显示“产品介绍”背景图片,显示“技术支持”主要内容3、插入t3,具体表格的单元格大小见代码。对整个t3设置背景颜色,其它内容如下:插入一条水平线输入版权等信息步骤三:保存网页并运行。参照网页代码如下:<!DOCTYPEhtmlPUBLIC"-//W3C////EN""/xhtml1/DTD/xhtml1-"><htmlxmlns="9/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/><title>公司首页</title><styletype="text/css"><!--.STYLE1{color:#FFFFFF;font-size:18pt;font-family:"宋体";font-weight:bold;}.STYLE2{font-size:16px;color:#FF0000;font-weight:bold;font-family:"宋体";}.STYLE3{font-size:18px;}body{background-color:#000033;}.STYLE4{font-size:18px;color:#000000;}--></style></head><bodyleftmargin="0"topmargin="0"marginwidth="0"marginheight="0"><tablewidth="778"border="0"align="center"cellpadding="0"cellspacing="0"><tr><throwspan="3"background=""scope="col"><imgsrc=""width="160"height="208"/></th><thscope="col"><imgsrc=""width="618"height="60"/></th></tr><tr><tdwidth="618"height="80"valign="middle"background=""><palign="center"class="STYLE1">您的公司名称</p></td></tr><tr><td><imgsrc=""width="618"height="68"/></td></tr></table><tablewidth="778"border="0"align="center"cellpadding="0"cellspacing="0"background=""><tr><tdheight="60"colspan="3"><tablewidth="778"border="0"cellspacing="0"cellpadding="0"><tr><thwidth="210"height="20"scope="col">&n