html_标签三

太过爱你忘了你带给我的痛 2022-05-25 04:41 161阅读 0赞

1. **表格**

语法：

<table>

<tr>

</tr>

<tr>

</tr>

</table>

<tr>定义表格行,<th>定义表头,<td>定义表格列

占两列：colspan=”2”

占两行：rowspan=”2”

![20180508111550168][]

![20180508111623423][]

**Thead\\tbody\\tfoot**

<head>

thead \{color:green\}

tbody \{color:blue;height:50px\}

tfoot \{color:red\}

</style>

</head>

<body>

<thead>

<tr>

<th>Month</th>

<th>Savings</th>

</tr>

</thead>

<tfoot>

<tr>

</tr>

</tfoot>

<tbody>

<tr>

<td>January</td>

</tr>

</tbody>

</table>

</body>

注释：<thead> 内部必须拥有 <tr> 标签！

注释：<thead>、<tbody> 以及 <tfoot> 很少被使用，这是因为糟糕的浏览器支持。

浏览器支持

![20180508111656601][]

<thead> 标签仅得到所有主流浏览器的部分支持。

2. **框架**

Frameset标签为框架标签，其和body平级，即使用frameset标签时不能使用body标签。

l 上下结构使用rows属性

l 左右结构使用cols属性

l 不充许改变比例，在frame标签中使用noresize属性

l Src属性指定框架内容

<frameset rows="20%,\*">

<frame src="top.html" noresize/>

</frameset>

![20180508111740361][]

![20180508111747685][]

注：真正做项目时不使用frameset框架，因为搜索引擎不能收录frame和iframe中的内容。真实项目中使用div+css做。

** **

3. **导航**

在框架的基础上添加导航功能：

因为左侧是导航，右侧页面需要动态的切换，因此右侧页面需要有个名字用于定位。

1. 给右侧页面所在位置起一个名字：

![20180508111838629][]

2. 左侧页面添加导航标签，指定target属性

![20180508111852483][]

![20180508111900924][]

[20180508111550168]: /images/20220525/02b5785990184af999ce19e5b5252f9e.png
[20180508111623423]: /images/20220525/165f28a3f3554a47946eccbe3417cae0.png
[20180508111656601]: /images/20220525/3fa6c5e2167e441693ba4afda8d54096.png
[20180508111740361]: /images/20220525/01f5627c7d914105815c1efbd1ca4098.png
[20180508111747685]: /images/20220525/a0b42026d8b14ffeb3732152fea8348c.png
[20180508111838629]: /images/20220525/6c174977f2034b098c3e3b5adb241cff.png
[20180508111852483]: /images/20220525/9ba1ef1dab3f4551999608af8fd87fef.png
[20180508111900924]: /images/20220525/2f7b1faa0430405f884ccd7eb5be7f13.png