今天我们来写个这样的试卷吧
UML试卷是这样的
来，看下这张试卷，恩恩，是纯html滴。
怎么开始写呢？我们来分析一下：
一. 结构是怎样的？
初步划分为7个部分：
- 最上面的试卷名称和学生要填写的信息为一部分
- 填空题为第二部分
- 选择题为第三部分
- 多项选择题为第四部分
- 判断题为第五部分
- 简答题为第六部分
- 最后的用来计算成绩的按钮为第七部分
二. 每一部分主要应该用什么标签？
- 第一部分是这张试卷的头部，应该用
<header></header>标签，试卷名称最合适的应该<h1></h1>标签了，下面要填写的信息就是<input />了。
- 第二到六的每一部分应该是一个
<section></section>了，而每个标题自然是<h3></h3>了，下面的具体题目应该就是<ol></ol>有序列表了。
以填空题为例我们来看下代码吧
<section>
<header>
<h3>一、填空题(每空５分，共20分)</h3>
</header>
<ol>
<li>UML的中文名称是：<br>
<input type="text" title="Fill_blank_1"/>
</li>
<li>对象最突出的特征是：
<input type="text" title="Fill_blank_2_(1)"/>
<input type="text" title="Fill_blank_2_(2)"/>
<input type="text" title="Fill_blank_2_(3)"/>
</li>
</ol>
</section>
- 最后一部分按钮自然就是
<footer></footer>里面的一个<button></button>了。
三.标签说明
h5中新标签
header—标签定义文档的页眉（介绍信息）
section—定义文档中的节（section、区段）。比如章节、页眉、页脚或文档中的其他部分。
footer—定义页面或章节的尾部
文字相关：
h — 定义标题1至标题6 h1, h2, h3, h4, h5, h6，文字大小依次减小
p — html段落标签p
div — html层的块标签
span —定义部分区块
*** 列表相关***
ul—无序列表
ol—有序列表
li—列表项
表单相关
- form -- html表单标签form
- select -- 定义可选择的html表单select
- textarea -- 定义一个多行的文字输入域textarea
-
input -- 定义一个表单的输入域input，不同的type对应不同的输入样式,下面为具体的type值
- text—文本域
- password—密码框
- checkbox—复选框
- radio—单选框
- submit—按钮
好了，详细的源代码请见我的github
