列表标签
作用:给一堆数据列表语义,也就是告诉游览器这一堆数据是一个整体,
一 . 无序标签(使用最多)
1 . 作用:给一堆数据添加列表语义,并且这一堆数据都没有先后之分。
2. 格式:
<ul>
<li>需要显示的条目内容</li>
</ul>
3 . 注意点:
1.<ul>标签
是用来添加语义的,而不是用来添加小圆点的。
2.<ul>
标签和<li>
标签是一个组合,一般都是同时出现的。
二 . 有序列表<ol>
1.作用:给一堆数据添加列表语义,并且这一堆数据有先后之分。
2.格式
<ol>
<li>需要显示的条目内容<li>
</ol>
三.定义列表
1.格式:
<dl>
<dt></dt>
<dd></dd>
<dt></dt>
<dd></dd>
<dl>
2.定义标签的作用:
2.1 做图文混排
2.2 做网站底部的相关信息
3.注意点:dl 和dd 是整体出现的,推荐使用一个dt对应一个dd。当有需要的时候,可以在dt或dd中添加其他标签。
表格标签
1.格式:
<table>
<tr>
<td> </td>
</tr>
</table>
2.作用:用来给一堆数据添加表格语义。
一. 表格标签的属性
1.宽度和高度的属性:可以给table标签和td标签使用
2.水平对齐和垂直对齐:其中水平对齐可以给table和tr和td使用。后者只能给tr和td使用
2.1:给table标签设置align属性可以使整个表格水平方向对齐。
2.2:给tr标签设置align属性可以控制当前行中所有单元格内容的水平方向的对齐方式。
2.3:给td标签设置align属性可以控制当前单元格中内容在水平方向对齐。
2.4.注意点:如果在td中设置了align属性,tr中也设置了align属性,那么单元格中的内容会按照td中设置的来对齐。
3. valign属性
3.1 给tr设置valign属性可以控制当前行中所用单元格内容的垂直方向对齐。
3.2 给td设置valine属性可以控制当前单元格内容在垂直方向对齐。
3.3.如果在td中设置了valign属性,tr中也设置了 valign属性,那么单元格中的内容会按照td中设置的来对齐。
4.外边距和内边距
4.1 注意点:只能给他table标签使用。
4.2 外边距:就是单元格与单元格之间的距离。
4.3属性格式:cellspacing=“0-x” 。默认情况下单元格与单元格之间的间距是2px。
5.内边距
5.1 定义:单元格边框与文字之间的距离。
5.2 属性格式:cellpadding=""
5.3 默认情况下,间距是1px.
二.细线表格
1.细线表格的制作方法:
步骤1. 给table标签设置bgcolor=“black”
步骤2. 给tr标签设置bgcolor=“white”
步骤3. 给table标签设置cellspacing=“1px”
2.注意点:
bgcolor这个属性可以给table,tr ,td使用。
三.表格里面的其他属性
1 表格标题:有一个标签caption标签,用来放置表格的标题
2 注意点:
2.1 这个标签一定要写在table标签中,否则无效。
2.2 这个标签一定要紧跟在table标签后。
3.标题单元格标签:用来存储每一列的标题,这个标签叫做th标签。到此为止,我们发现,表格中有两种单元格,一种是td,一种是th。td是用来存储数据的,th是专门用来存储当前列的标题的。
4.表格的结构;由于表格中存储的数据比较复杂,为了方便管理,我们可以对表格中存储的数据进行分类1.-表格的标题、2.-表格的表头、3.-表格的主题信息、4.-表格的页尾信息
4.1 表格的完整结构
<table>
<caption>表格的标题</caption>
<thead>
<tr>
<th>每一列的标题</th>
</tr>
</thead>
<tbody>
<tr>
<td>数据</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>数据</td>
</tr>
</tfoot>
</table>
4.2 caption作用:指定表格的标题、-thead作用:指定表格的表头信息、-tbody作用:指定表格的主体信息、-tfoot作用:指定表格的附加信息。
4.3 注意点:
4.3.1.如果我们没有编写tbody,系统会自动非我们添加tbody标签。
4.3.2.如果指定了thead和tfoot,那么在修改整个表格高度是,thead和tfoot有自己的默认高度,不会随着表格的高度变化而变化。
四. 单元格合并**
1.水平方向上的单元格合并:在td里面添加一个属性colspan,来指定吧某一个单元格当做多个单元格来看待。
1.1 注意点:单元格合并永远都是向后或者向下合并,而不能向前或者向上合并。
2.垂直方向上的单元格合并:在td标签里面添加一个属性rowspan,来指定把某一个单元格当做多个单元格看待(垂直方向。)