学前端的第7天

一、表格

1.跨行和跨列，如图效果

先把表头写好<th>表头</th>
跨行：rowspan
跨列：colspan
把这两个属性放到标签里面
<th colspan="2">表头</th> （得到上面那个表格的效果）
！！！注意：在一对tr标签里只能表示一行，下面那个表格Telephone:和555 77 854是一行，555 77 855另起一行

<tr>
    <th rowspan="2">Telephone:</th>
    <td>555 77 854</td>
</tr>
<tr>
    <td>555 77 855</td>
</tr>

2.表格的某个格子显示表格或列表
td可认为是最外层表格的一个块
只要东西都在这个块里面，那么就在一对td标签内，不管里面放的是表格，段落，还是其他东西

3.单元格内容与边框的距离

在table的标签中加属性cellpadding
<table border="1" cellpadding="40"></table>
这里设置的边框与内容距离是把内容放在格子中间，内容的上下左右四个距离都改变

4.单元格之间的距离

从上到下单元格之间的距离依次为1，0，10
不设置单元格之间的距离，默认为1
在table标签里放置属性cellspacing来设置

二、列表

1.无序列表
①无序列表标签为：ul
②每一项内容标签：li
③列表类型：黑圆点(disc)，圆圈(circle)，黑色方形(square)
在ul标签中设置属性style
<ul style="list-style-type:disc/circle/square"></ul>

<ul>
    <li>Coffee</li>
    <li>Tea</li>
    <li>Milk</li>
</ul>

2.有序列表
①有序列表标签为：ol，列表项目用数字进行标记
②设置数字标号，在标签ol中使用属性start=""设置：start=50，那么标号就从50开始
③设置英文标号，属性type：大写字母标号type=“A”，小写字母标号type=“a”（从哪个字母开始就把type设置成哪个）
④设置罗马数字标号，属性type：大写罗马数字标号type=“I”，小写罗马数字标号type=“i”（从哪个数字开始就把type设置成哪个）
⑤列表项还是使用li标签

3.自定义列表
项目和注释的组合
自定义列表标签：dl
项目标签：dt
注释标签：dd
所有的列表中，列表项可以使用段落，图片，链接，其他列表等。

三.布局

1.区块元素
块级元素在浏览器显示时，通常会以新行来开始（和结束）。
例如：h1,p,ul,table

2.内联元素
内联元素在显示时通常不会以新行开始。
例如：b,td,a,img
b标签：粗体文本

3.div布局
div 元素是用于分组 HTML 元素的块级元素。
margin-bottom：下外边距
换行的br有几种写法

所有浏览器都支持 <br> 标签。
HTML 与 XHTML 之间的差异
在 HTML 中，<br> 标签没有结束标签。
在 XHTML 中，<br> 标签必须被正确地关闭，比如这样：<br />。