需求
现在我们有这样一个需求:
使用纯HTML(不含CSS/JS)制作以下网页
分析
仔细分析网页元素可以看到:
- 标题应该用
<h2>
标签(具体用<h1>
或是<h2>
、<h3>
不重要) - 文本框使用
<input type="text">
- 文本可以使用
<span>
(不用也可以) - 单选框使用
<input type="radio">
- 复选框使用
<input type="checkbox">
- 文本区域可以使用
<textarea>
- “计算分数”按钮使用
<input type="button">
- 最后有个水平线,使用<hr />
编码
可以得到类似下面的HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>UML Test</title>
</head>
<body>
<header>
<h2>统一建模语言理论测试</h2>
<span>考试科目:统一建模语言</span><br/>
<span>考试时间:100分钟</span><br/>
<span>得分:</span><br/>
</header>
<form>
<span>班级(必填):</span><input id="class" type="text" name="班级"><br />
<span>学号(必填):</span><input id="number" type="text" name="学号"><br />
<span>姓名(必填):</span><input id="name" type="text" name="姓名"><br />
... ...
<input type="button" name="submit" value="计算分数" id="submit" />
</form>
<hr />
</body>
</html>
代码这里就不详细解释了,需要完整代码的请看这里。