html基础知识(三):表格和表单进阶
2019-06-12 15:29
1116 查看
html基础知识(三):表格和表单进阶
1. 题目:课程表中的表格显示
1.1 课程表代码实现图
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>课程表</title> <style> table{align-content: center;color:rebeccapurple} /*table tr th{background: blue;}*/ </style> </head> <body> <table align="center" width="500" height="800" border="1" background="img/b.jpg" cellpadding="0" cellspacing="0"> <!--快速创建表格的 table>tr*5>td*9 --> <caption><h2>第3周</h2></caption> <tr> <th>6月</th> <th>周一</th> <th>周二</th> <th>周三</th> <th>周四</th> <th>周五</th> <th>周六</th> <th>周日</th> </tr> <tr> <td>1</td> <td rowspan="2" bgcolor="aqua">高职实用英语</td> <td rowspan="2" bgcolor="#483d8b" >中国现代文学</td> <td rowspan="2" bgcolor="#ffc0cb">思想道德与法律基础</td> <td rowspan="2" ></td> <td rowspan="2" bgcolor="#db7093">基础写作</td> <td rowspan="10" bgcolor="#fafad2">思想道德与法律基础</td> <td rowspan="2"></td> </tr> <tr> <td>2</td> </tr> <tr> <td>3</td> <td rowspan="2" bgcolor="#ffc0cb">思想道德与法律基础</td> <td rowspan="2" bgcolor="green">普通话训练</td> <td rowspan="2" bgcolor="aqua">高职实用英语</td> <td rowspan="2" bgcolor="yellow">文学概论</td> <td rowspan="2" bgcolor="#db7093">现代汉语</td> <td rowspan="2"></td> </tr> <tr> <td>4</td> </tr> <tr> <td>5</td> <td rowspan="2" bgcolor="yellow">文学概论</td> <td rowspan="2" bgcolor="#db7093">基础写作</td> <td rowspan="2" bgcolor="green">普通话训练</td> <td rowspan="2" bgcolor="#483d8b">中国现代当代文学</td> <td rowspan="3" bgcolor="orange">专业导论与专业创业</td> <td rowspan="2"></td> </tr> <tr> <td>6</td> </tr> <tr> <td>7</td> <td rowspan="2" bgcolor="#adff2f">体育与健康</td> <td rowspan="2" bgcolor="#db7093">现代汉语</td> <td rowspan="2"></td> <td rowspan="2" bgcolor="#006400">大学生心理健康教育</td> <td rowspan="2"></td> </tr> <tr> <td>8</td> <td></td> </tr> <tr> <td>9</td> <td rowspan="2"></td> <td rowspan="2"></td> <td rowspan="2"></td> <td rowspan="2"></td> <td rowspan="2"></td> <td rowspan="2"></td> <td rowspan="2"></td> </tr> <tr> <td>10</td> </tr> </table> </body> </html>
1.2 课程表代码实现图**
2. 题目:项目申请表单**
*2.1 项目申请表单实现代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>项目招标申请表</title> </head> <body> <form> <table align="center" width="1000" height="800" border="1" bgcolor="#f0fff0" cellpadding="0" cellspacing="0"> <tr> <td colspan="15" align="center" style="color: orange"><h2>项目申请表</h2></td> </tr> <tr> <td colspan="5">项目编号<input type="text" name="id1"/></td> <td colspan="2">申请编号</td> <td><input type="text" name="id2"/></td> <td colspan="2">申请人</td> <td colspan="7"><input type="text" name="name"/></td> </tr> <tr> <td rowspan="9"><h2>项目概况</h2></td> <td colspan="2">项目名称</td> <td colspan="13"><input type="text" name="name5" style="width: 500px"/></td> </tr> <tr> <td colspan="2">项目地址</td> <td colspan="12"><input type="text" name="address" style="width: 500px"/></td> </tr> <tr> <td colspan="2">项目总投资</td> <td><input type="text" name="money"/></td> <td colspan="2">项目来源</td> <td><input type="text" name="source"/></td> </tr> <tr> <td colspan="2">项目性质</td> <td colspan="12"><input type="checkbox" name="cha" value="1"/>国有及国有控股% <input type="checkbox" name="cha" value="2"/>外贸独资 <input type="checkbox" name="cha" value="3"/>个人投资 <input type="checkbox" name="cha" value="4"/>国际组织或者外国政府贷款、资助资金 <br/> <input type="checkbox" name="cha" value="5"/>国家政策融资 <input type="checkbox" name="cha" value="6"/>中外台资 <input type="checkbox" name="cha" value="7"/>其它 </td> </tr> <tr> <td colspan="2" rowspan="3">项目规模</td> <td colspan="4">标段</td> <td colspan="4">建筑面积</td> <td colspan="4">栋号</td> </tr> <tr> <td colspan="4"><input type="text" name="area"/></td> <td colspan="4"><input type="text" name="area"/></td> <td colspan="4"><input type="text" name="area"/></td> </tr> <tr> <td colspan="4"><input type="text" name="area"/></td> <td colspan="4"><input type="text" name="area"/></td> <td colspan="4"><input type="text" name="area"/></td> </tr> <tr> <td colspan="2">项目类型</td> <td colspan="12"><input type="checkbox" name="type1" value="1"/>住宅 <input type="checkbox" name="type1" value="2"/>公建 <input type="checkbox" name="type1" value="3"/>厂房 <input type="checkbox" name="type1" value="4"/>市政 <input type="checkbox" name="type1" value="5"/>场站 <input type="checkbox" name="type1" value="6"/>管线 <input type="checkbox" name="type1" value="7"/>道桥 <input type="checkbox" name="type1" value="8"/>绿化 <input type="checkbox" name="type1" value="9"/>其它 </td> </tr> <tr> <td colspan="2">招标类型</td> <td colspan="12"><input type="checkbox" name="type2" value="1"/>斟察 <input type="checkbox" name="type2" value="2"/>设计 <input type="checkbox" name="type2" value="3"/>施工 <input type="checkbox" name="type2" value="4"/>监理 <input type="checkbox" name="type2" value="5"/>设备 <input type="checkbox" name="type2" value="6"/>项目管理 </td> </tr> <tr> <td rowspan="3">建设单位</td> <td colspan="2">单位名称</td> <td colspan="5"><input type="text" name="class1"/></td> <td colspan="2">经办人</td> <td colspan="5"><input type="text" name="class2"/></td> </tr> <tr> <td colspan="2">单位地址</td> <td colspan="12"><input type="text" name="class2" style="width: 800px"/></td> </tr> <tr> <td colspan="2">法定代表</td> <td colspan="5"><input type="text" name="class3"/></td> <td colspan="2">授权委托人</td> <td colspan="5"><input type="text" name="class3"/></td> </tr> </table> </form> </body> </html>
2.2 项目申请表单实现图
相关文章推荐
- html表单:HTML表单基础知识
- html基础知识点--表单元素及其相关知识
- 【HTML】 HTML基础知识 表单
- WEB前端 | HTML基础——(5)表格和表单
- 前端html基础(下篇)table表格元素与表单元素
- html基础知识:form表单和框架
- html学习记录之表格、表单基础
- Html的表单基础知识
- Web基础知识五之Html表单标记
- htmlcss基础知识点表单
- HTML中表格和表单的基础写法
- HTML基础7--表格表单
- HTML基础知识二(页面属性、注释、表格、设置表框颜色)
- HTML基础知识三(超链接、表单)
- HTML基础第五课(表格,表单,行块对齐方式)
- html+css基础视频80-88/表格和表单的使用
- 【HTML基础】表格和表单
- html5基础知识(2)-——表格&&列表&&表单
- 网站开发之HTML基础表格Table和表单Form(三)
- Html基础学习四:列表,超链接,表格,层,框架,表单