HTML-表格与div标签

基本表格

表格是用于排序内容的最佳手段。在HTML页面中，有很多页面都是使用表格进行排版的。基本表格是由

<table>

标签、

<tr>

标签和

<td>

标签组成的。通过使用

<table>

标签，可以制作课程表、成绩单等常见的表格。

用于制作表格的主要标签：

<table>

<tr>

<td>

语法个格式如下：

<table>
<tr>
<td>单元格内的文字</td>
<td>单元格内的文字</td>
...
</tr>
<tr>
<td>单元格内的文字</td>
<td>单元格内的文字</td>
...
</tr>
...
</table>

在上面代码中，

<table>

和

</table>

标签分别表示一张表格的开始和结束；而

<tr>

和

</tr>

标签则分别表示表格中一行开始和结束表示改表格有几行；

<td>

和

</td>

标签分别表示一个单元格的开始与结束，也就是一行中包括几列。

表头的设置：

表格中还有一种特殊的单元格，称为表头。表头一般位于表格第一行，用来表明改列的内容类别，用

<th>

和

</th>

标签来表示。标签与标签的使用方法相同，但是标签中内容是加粗显示的。

语法格式如下：

<table>
<caption>表格的标题</caption>
<tr>
<th>表格的表头</th>
<th>表格的表头</th>
....
</tr>
<tr>
<td>单元格内的文字</td>
<td>单元格内的文字</td>
....
</tr>
....
</table>

<div>

标签：

1. <div>

   标签是用来为HTML文档的内容提供结构和背景的元素。

   <div>

   开始标签和

   </div>

   结束标签之间的所有内容都是用来构成这个块的，其中所包含标签的特性由

   <div>

   标签中的属性来控制，或者通过使用样式表格化这个块进行控制。
2. div的全称为division，意为“分隔”

   <div>

   标签被称为分割标签，表示一块可以显示HTML的区域，用于设置字、图片、表格等的摆放位置。div标签是块级标签，需要结束标签

   </div>

   
   （说明：块级标签又名块级元素（Block Element)，与其对应的是内联元素（也称行内标签））

语法格式如下：

<div>
.....
</div>

块元素和行内元素

• 块元素：在HTML中，块元素在浏览器显示状态下将占据一整行，并且排斥其他元素与其位于同一行。此外，一般情况下，块元素内部可以容纳其他块元素和行内元素。
• 行内元素：在HTML中，行内元素跟块元素恰恰相反，行内元素是可以其他行内元素位于同一行的，此外，行内元素内部（标签内部）只可以容纳其他行内元素，不可以容纳块元素。

HTML常见块元素

HTML常见行内元素

行内元素可以与其他行内元素位于同一行 行内元素内部可以容纳其他行内元素，但是不可以容纳块元素