HTML任务完成
2016-12-10 本文已影响0人
Aym_fuhong
1.练习说明：
- 列表完成思路：
总体是个无序列表 —> 无序列表的每个标签中有一个有序列表 —> 有序列表的每个标签中有一个无序列表
task01.png
代码如下：
<ul>
<li>JavaScript
<ol>
<li>第一章
<ul>
<li>const</li>
<li>let</li>
</ul>
</li>
<li>第二章
<ul>
<li>function</li>
<li>object</li>
</ul>
</li>
</ol>
</li>
<li>Java
<ol>
<li>第一章
<ul>
<li>class</li>
<li>package</li>
</ul>
</li>
<li>第二章
<ul>
<li>private</li>
<li>public</li>
</ul>
</li>
</ol>
</li>
</ul>
- 表格完成思路：
完成一个5行4列的表格，他的border='1'，添加表头文字 —> 第一行第一列和第四列rowspan='2',第二列cowspan='2' —> 第四行第一列cowspan=‘2’ —> 添加表格单元格文字，并设置居中 —> 将第一行第二列文字加粗
task02.png
代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>html任务</title>
<style>
td {
text-align: center;
}
</style>
</head>
<body>
<table border='1'>
<caption>购物车</caption>
<tr>
<td rowspan='2'>名称</td>
<td colspan='2'><strong>2016-11-22</strong></td>
<td rowspan='2'>小计</td>
</tr>
<tr>
<td>重量</td>
<td>单位</td>
</tr>
<tr>
<td>苹果</td>
<td>3公斤</td>
<td>5元/每公斤</td>
<td>15元</td>
</tr>
<tr>
<td>香蕉</td>
<td>2公斤</td>
<td>6元/每公斤</td>
<td>12元</td>
</tr>
<tr>
<td colspan='3'>总价</td>
<td>27元</td>
</tr>
</table>
</body>
</html>
2.任务完成
结果如图：
task03.png
代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>HTML练习</title>
</head>
<body>
<p><h1>统一建模语言理论测试</h1></p>
考试科目：统一建模语言<br/>
考试时间：100分钟<br/
>得分：<br/>
班级（必填）：<input type='text'/><br/>
学号（必填）：<input type='text'/><br/>
姓名（必填）：<input type='text'/><br/>
<p><strong>一、填空题（每空5分,共20分）</strong></p>
<div style="margin-left: 20px">
1.UML的中文全称是：<br/>
<input type='text'/><br/>
2.对象最突出的特征是：<br/>
<input type='text'/> <input type='text'/> <input type='text'/>
</div
><p><strong>二、选择题（每题10分,共20分）</strong></p>
<div style="margin-left: 20px">
1.UML与软件工程的关系是：<br/>
<input type='radio'/>(A)UML就是软件工程<br/>
<input type='radio'/>(B)UML参与到软件工程开发过程中几个阶段<br/>
<input type='radio'/>(C)UML与软件工程无关<br/>
<input type='radio'/>(D)UML是软件工程的一部分<br/>
2.Java语言支持：<br/>
<input type='radio'/>(A)单继承<br/>
<input type='radio'/>(B)多继承<br/>
<input type='radio'/>(C)单继承和多继承都支持<br/>
<input type='radio'>(D)单继承和多继承都不支持
</div>
<p><strong>三、多项选择题（每题10分,共20分）</strong></p>
<div style="margin-left: 20px">
1.用例的粒度分为以下哪三种：<br/>
<input type='checkbox'/>(A)概述级<br/>
<input type='checkbox'/>(B)需求级<br/>
<input type='checkbox'/>(C)用户目标级<br/>
<input type='checkbox'/>(D)子功能级<br/>
2.类图由以下哪三部分组成：<br/>
<input type='checkbox'/>(A)名称（Name）<br/>
<input type='checkbox'/>(B)属性(Attribute)<br/>
<input type='checkbox'/>(C)操作(Operation)<br/>
<input type='checkbox'>(D)方法(Function)
</div>
<p><strong>四、判断题（每题10分,共20分）</strong></p>
<div style="margin-left: 20px">
1.用例图只是用于客户交流和沟通的，用于确定需求。
<input type='radio'/>对
<input type='radio'/>错<br/>
2.在状态图中，终止状态在状态图中允许有任意多个。
<input type='radio'/>对
<input type='radio'/>错
</div>
<p><strong>五、简答题（每题10分,共20分）</strong></p>
<div style="margin-left: 20px">
1.简述什么是模型以及模型的表现形式？
<textarea style="width: 100px; height: 60px;"></textarea><br/>
<input type='button' value='计算分数'/>
</div>
</body>
</html>
