html表格设计.docVIP

学 生 实 验 报 告 学 院： 课程名称： 专业班级： 姓 名： 学 号： 学生实验报告 学生姓名 学号 同组人：无 实验项目 HTML表格设计 □必修 ■选修 □演示性实验 □验证性实验 ■操作性实验 □综合性实验 实验地点 H113 实验仪器台号 1台 指导教师 钟元生 实验日期及节次 2011-4-15上午1.2.3节课 一、实验综述 1、实验目的及要求 目的： 1．掌握HTML语言主要标记符的含义。 2．掌握使用HTML语言进行简单的表格设计； 仪器设备html head title 电子商务 /title /head body form action=/cgi-bin/post-query method=POST input type=radio name=水果 checked Bananap input type=radio name=水果 Applep input type=radio name=水果 value=橘子 Orangep input type=submitinput type=reset /form /body /html (2)在记事本中编辑的代码截图如下： （3）将记事本中的文件另存为“dxh.html”，注意在存储的时候一定要带双引号。用浏览器 打开刚刚存的html文件，截图如下： 2.列表框标签select的小实验： （1）在记事本文件中键入一下代码： html head title电子商务/title /head body form action=/cgi-bin/post-query method=POST select name=fruits size=3 multiple option selectedBanana option selectedApple option value=My_FavoriteOrange option selectedPeach /selectp input type=submitinput type=reset /form /body /html （2）在记事本中输入的代码截图如下： （3）将刚刚的记事本中的文件存储为html文件，用浏览器打开刚刚的html文件，其效果图截图如下： 3.表格标签table的小实验： （1）在建好记事本中键入代码： html head title电子商务/title /head body table border=1 tr thFood/ththDrink/ththSweet/th /tr tr tdA/tdtdB/tdtdC/td /tr /table /body /html (2)在记事本中输入的代码截图如下： （3）将刚刚的记事本中的文件存储为html文件，用浏览器打开刚刚的html文件，其效果图截图如下： 4.使用HTML语言制作一页web页，其中标题为：学生班干基本信息。在页面中插入一个三行二列的表格，宽度为200像素，边框为1，第一行的数据分别为姓名和职务，第二行数据为张三和班长，第三行为李四和团支书 ，其中班长用红色字体显示，各行数分别居中，表格边框为蓝色。并保存为html head title学生班干基本信息/title /head body table width=200 border=1 tr td align=center姓名/td td align=center职务/td /tr tr td align=center张三/td td align=centerfont color=red班长/font/td /tr tr td align=center李四/td td align=center团支书/td /tr /body /html （2）在记事本中输入的代码截图如下： （3）将刚刚的记事本中的文件存储为html文件，用浏览器打开刚刚的html文件，其效果图截图如下： 三、结论结　 文档一般分为两部分：文档首部（）和文档主体（）。文档首部是框在……/head中的部分，文档主体则是位于……/body之间的部分。”文件名.html”。 （5）通过本实验使我掌握语言主要标记符的含义掌握使用语言进行简单的表格设计； 成绩： 指导教师签名： 批阅日期：