HTML介绍
HTML是英文Hyper Text Mark-up Language(超文本标记语言)的缩写，它规定了自己的语法规则，用来表示比“文本”更丰富的意义，比如图片，表格，链接等。
暂时先介绍一下列表和表格属性吧。
1、列表
1.1 无序列表
无序列表是一个项目的列表，此列项目使用粗体圆点（典型的小黑圆圈）进行标记。无序列表始于<ul> 标签。每个列表项始于 <li>。
看如下例子：
<ul>
<li>一行</li>
<li>又一行</li>
<li>再一行</li>
</ul>
1.2 有序列表
有序列表也是一列项目，列表项目使用数字进行标记。有序列表始于
<ol> 标签。每个列表项始于 <li> 标签。
<ol>
<li>第一行</li>
<li>第二行</li>
<li>第三行</li>
</ol>
1.3嵌套列表
下面是W3School上面的例子
<ul>
<li>咖啡</li>
<li>茶
<ul>
<li>红茶</li>
<li>绿茶
<ul>
<li>中国茶</li>
<li>非洲茶</li>
</ul>
</li>
</ul>
</li>
<li>牛奶</li>
</ul>
接下来做一下作业：
<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>prievat</li>
<li>public</li>
</ul>
</li>
</ol>
</li>
</ul>
2、表格
表格由 <table> 标签来定义。每个表格均有若干行（由 <tr> 标签定义），每行被分割为若干单元格（由 <td> 标签定义）。字母 td 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。
普通表格例子：
<table>
<tr>
<td>第一行第一列</td>
<td>第一行第二列</td>
</tr>
<tr>
<td>第二行第一列</td>
<td>第二行第二列</td>
</tr>
</table>
显示如下图：
没有边框是不是看着有点子怪怪的。。下面就说一下表格的边框属性。
2.1 边框属性
使用边框属性
border来显示一个带有边框的表格：
<table border="1">
<tr>
<td>第一行第一列</td>
<td>第一行第二列</td>
</tr>
<tr>
<td>第二行第一列</td>
<td>第二行第二列</td>
</tr>
</table>
这样看着是不是好一点：
2.2 表头属性
表格的表头使用
<th> 标签进行定义，大部分浏览器会将表头显示为粗体居中的文本。
<table border="1">
<tr>
<th>表头</th>
<th>表头</th>
</tr>
<tr>
<td>第一行第一列</td>
<td>第一行第二列</td>
</tr>
<tr>
<td>第二行第一列</td>
<td>第二行第二列</td>
</tr>
</table>
显示如下：
2.3 标题
caption 元素定义表格标题。caption 标签必须紧随 table 标签之后.
<table border="1">
<caption> 我是标题</caption>
<tr>
<th>表头</th>
<th>表头</th>
</tr>
<tr>
<td>第一行第一列</td>
<td>第一行第二列</td>
</tr>
<tr>
<td>第二行第一列</td>
<td>第二行第二列</td>
</tr>
</table>
2.4 单元格合并
colspan是表示横向合并单元格，colspan=“3”表示水平合并三个td
rowspan是表示竖直合并单元格，rowspan=“2” 表示竖直合并两个td
接下来我们试试看：
<h4>横跨两列的单元格：</h4>
<table border="1">
<tr>
<th>姓名</th>
<th colspan="2">电话</th>
</tr>
<tr>
<td>Bill Gates</td>
<td>555 77 854</td>
<td>555 77 855</td>
</tr>
</table>
<h4>横跨两行的单元格：</h4>
<table border="1">
<tr>
<th>姓名</th>
<td>Bill Gates</td>
</tr>
<tr>
<th rowspan="2">电话</th>
<td>555 77 854</td>
</tr>
<tr>
<td>555 77 855</td>
</tr>
</table>
先掌握这几个基本技能，把作业做一下：
<table border="1">
<caption> 购物车</caption>
<tr>
<th rowspan="2">名称</th>
<th colspan="2">2016-11-22</th>
<th rowspan="2">小计</th>
</tr>
<tr>
<th>重量</th>
<th>单价</th>
</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" align="center">总价</td>
<td>27元</td>
</tr>
</table>
还有一个完整页面：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>统一建模语言理论测试</title>
</head>
<body>
<h1>统一建模语言理论测试</h1>
<p>考试科目：统一建模语言</p>
<p>时间：100分钟</p>
<p>得分： </p>
<p>班级（必填）：<input /></p>
<p>学号（必填）：<input /></p>
<p>姓名（必填）：<input /></p>
<h2>一、填空题（每空5分，共20分）</h2>
<p>1. UML的中文全称是：</p>
<p><input /></p>
<p>2. 对象最突出的特征是：</p>
<p><input /><input /><input /></p>
<h2>二、选择题（每题10分，共20分）</h2>
<p>1. UML与软件工程的关系是：</p>
<p><input type=radio name=answer21>(A)UML就是软件工程</p>
<p><input type=radio name=answer21>(B)UML参与到软件工程中软件开发过程的几个阶段</p>
<p><input type=radio name=answer21>(C)UML与软件工程无关</p>
<p><input type=radio name=answer21>(D)UML是软件工程的一部分</p>
<p>2. Java语言支持：</p>
<p><input type=radio name=answer22>(A)单继承</p>
<p><input type=radio name=answer22>(B)多继承</p>
<p><input type=radio name=answer22>(C)单继承和多继承都支持</p>
<p><input type=radio name=answer22>(D)单继承和多继承都不支持</p>
<h3>三、多项选择题（每题10分，共20分）</h3>
<p>1. 用例的粒度分位以下哪三种：</p>
<p><input type=checkbox name=answer31>(A)概述级</p>
<p><input type=checkbox name=answer31>(B)需求级</p>
<p><input type=checkbox name=answer31>(C)用户目标级</p>
<p><input type=checkbox name=answer31>(D)子功能级</p>
<p>2. 类图由以下哪三部分组成：</p>
<p><input type=checkbox name=answer32>(A)名称(Name)</p>
<p><input type=checkbox name=answer32>(B)属性(Attribute)</p>
<p><input type=checkbox name=answer32>(C)操作(Operation)</p>
<p><input type=checkbox name=answer32>(D)方法(Function)</p>
<h3>四、判断题（每题10分，共20分）</h3>
<p>1. 用例图知识用于和客户交流和沟通的，用于确定请求。
<input type=radio name=answer41>
<input type=radio name=answer41>
</p>
<p>2. 在状态图中，终止状态在一个状态图中允许有任意多个。
<input type=radio name=answer42>
<input type=radio name=answer42>
</p>
<h3>五、简答题（每题20分，共20分）</h3>
<p>1. 简述什么是模型以及模型的表现形式？</p>
<input />
<br>
<button>计算分数</button>
</body>
</html>
显示如下：
网友评论