要实现上面这样的一个试卷界面.我主要是先将试卷分为几部分.
第一部分
主要用<div>实现,以及用<ol>来实现填空题的形式
<div>
<h1><strong>统一建模语言理论测试</strong></h1>
</div>
<div>考试科目：统一建模语言</div>
<div>时间：100分钟</div>
<div>得分：</div>
<div>班级（必填）：<input type="text" name="class"></div>
<div>学号（必填）：<input type="text" name="number"></div>
<div>姓名（必填）：<input type="text" name="yourname"></div>
<div>
一、填空题（每空5分，共20分）
</div>
<ol>
<li>UML的中文全称是:
<div>
<input type="text" name="answer">
</div>
</li>
<li>对象最突出的特征是:
<div>
<input type="text" name="answer">
<input type="text" name="answer">
<input type="text" name="answer">
</div>
</li>
</ol>
第二部分
主要用<div>实现换行的冲突,<ol>实现选择的题号,用input标签实现单选
<div>
二、选择题（每题10分，共20分）
</div>
<ol>
<li>UML与软件工程的关系是:</li>
<div>
<input type="radio" value="1" name="select1" />
（A）UML就是软件工程</div>
<div>
<input type="radio" value="2" name="select1" />
（B）UML参与到软件工程中软件开发过程的几个阶段 </div>
<div>
<input type="radio" value="3" name="select1" />（C）UML与软件工程无关</div>
<div>
<input type="radio" value="4" name="select1" />（D）UML是软件工程的一部分</div>
<li>Java语言支持:</li>
<div> <input type="radio" value="1" name="select2" />（A）单继承</div>
<div> <input type="radio" value="2" name="select2" />（B）多继承</div>
<div><input type="radio" value="3" name="select2" />（C）单继承和多继承都支持</div>
<div><input type="radio" value="4" name="select2" />（D）单继承和多继承都不支持</div>
</ol>
实现如下:
第二部分
第三部分
第三部分则是用代码实现多选框
<div>
三、多项选择题（每题10分，共20分）
</div>
<ol>
<li>用例的粒度分为以下哪三种：
<div><input type="checkbox" value="1" name="select3" />（A）概述级</div>
<div><input type="checkbox" value="2" name="select3" />（B）需求级</div>
<div><input type="checkbox" value="3" name="select" />（C）用户目标级</div>
<div><input type="checkbox" value="4" name="select3" />（D）子功能级</div>
</li>
<li>类图由以下哪三部分组成：
<div><input type="checkbox" value="1" name="select4" />（A）名称（Name）</div>
<div><input type="checkbox" value="2" name="select4" />（B）属性（Attribute）</div>
<div><input type="checkbox" value="3" name="select4" />（C）操作（Operation）</div>
<div><input type="checkbox" value="4" name="select4" />（D）方法（Function）</div>
</li>
</ol>
实现如下:
第三部分
第四部分
主要是将最后的判断题和简答题以及计算分数的按钮实现
<div>
四、判断题（每题10分，共20分）
</div>
<ol>
<li>用例图只是用于和客户交流和沟通的，用以确定需求。
<input type="radio" value="1" name="judge" />T
<input type="radio" value="2" name="judge" />F</li>
<li>在状态图中，终止状态在一个状态图中允许有任意多个。
<input type="radio" value="1" name="judge" />T
<input type="radio" value="2" name="judge" />F</li>
</ol>
<div>
五、简答题（每题20分，共20分）
</div>
1.简述什么是模型以及模型的表现形式？
<div id="foot"><button type="button">计算分数</button></div>
第五部分
**-
经过以上四个部分的组合,一个完整的纯HTML试卷页面就得到啦!
嘿呦喂!
