JAVA学习日记002———HTML列表、表格

我是Fat Loong Cat 目前正在读大四。本文主要是记录我在学习Java中的一些知识点以及老师传授的重点内容。所有内容仅代表个人观点，如有错漏，欢迎斧正。

一、广义上列表的定义

列表就是信息资源的一种展示形式。它可以使信息结构化和条理化，并以列表的样式显示出来，以便浏览者能更快捷地获得相应的信息。

二、HTML列表的类型和应用

一）无序列表

1.代码示例：

<ul>
    <li>法外狂徒张三被捕</li>
    <li>某男子乘坐飞机到他人祖坟疯狂偷吃贡品</li>
    <li>黑人丧葬业务引起火热</li>
<ul>
    

2.特性：

没有顺序，每个<li>标签独占一行（块元素）

默认<li>标签项前面有个实心小圆点

一般用于无序类型的列表，如导航、侧边栏新闻、有规律的图文组合模块等

二）有序列表

1.代码示例：

<ol>
		<li>甲乙</li>
		<li>丙丁</li>
		<li>戊己</li>
		<li>庚辛</li>
</ol>

2.特性：

有顺序，每个<li>标签独占一行（块元素）

默认<li>标签项前面有顺序标记

一般用于排序类型的列表，如试卷、问卷选项等

三）定义列表

1.代码示例：

<dl>
    <dt>水果</dt>
    <dd>苹果</dd>
    <dd>桃子</dd>
    <dd>李子</dd>
</dl>

2.特性：

没有顺序，每个<dt>标签、<dd>标签独占一行（块元素）

默认没有标记

一般用于一个标题下有一个或多个列表项的情况

四）列表对比

类型	说明	项目符号
无序列表	以<ul>标签来实现 以<li>标签表示列表项	无序列表中的每项都是平级的，没有级别之分， 并且列表中的内容一般都是相对简单的标题性质 的网页内容
有序列表	以<ol>标签来实现 以<li>标签表示列表项	有序列表ol-li一般用于显示带有顺序编号的特定场合
定义类表	以<dl>标签来实现 以<dt>标签定义列表项 以<dd>标签定义内容	定义列表一般适用于带有标题和标题解释性内容的场合

三、网站开发中为什么会使用表格

1.简单通用：

由于表格行列结构简单，以及在生活中使用广泛，因此对他的理解和编写都很方便。

2.结构稳定：

表格通常每行的列数一直，同行单元格高度一直且水平对齐，同列单元格宽度一致且垂直对齐。这种严格的约束形成了一个不易变形的长方形盒子结构，堆叠排列起来结构很稳定。

3.特定需求：

开发一些特殊的网站比如管理系统，用表格呈现数据显得直观而且便于计算。

四、表格的基本语法

 

一）定义和用法

<table> 标签定义 HTML 表格。

简单的 HTML 表格由 table 元素以及一个或多个 tr、th 或 td 元素组成。

tr 元素定义表格行，th 元素定义表头，td 元素定义表格单元。

更复杂的 HTML 表格也可能包括 caption、col、colgroup、thead、tfoot 以及 tbody 元素。

二）跨行跨列表格

<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><br/><br/>

<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>