lable标签
有时候，我们希望点击文件的时候，鼠标的光标自动跳到输出框中。这需要使用lable功能
|
1
2
3
4
5
|
<
div
>
<
label
for
=
"name2"
>姓名：<
input
id
=
"name2"
type
=
"test"
></
label
>
<
label
for
=
"111"
>密码：<
input
id
=
"111"
type
=
"test"
></
label
>
<
label
for
=
"222"
>婚否 <
input
id
=
'222'
type
=
"checkbox"
></
label
>
</
div
>
|
ul、ol、dl标签
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
<
div
>
<
ul
>
<
li
>淘宝</
li
>
<
li
>百度</
li
>
<
li
>腾讯</
li
>
</
ul
>
<
ol
>
<
li
>淘宝</
li
>
<
li
>百度</
li
>
<
li
>腾讯</
li
>
</
ol
>
<
dl
>
<
dt
>湖北省</
dt
>
<
dd
>咸宁市</
dd
>
<
dd
>武汉书</
dd
>
<
dd
>赤壁市</
dd
>
</
dl
>
</
div
>
|
table标签
table标签用来制作表格的。
<tr></tr> 表示行，同一行的内容写在一个<tr></tr>中，<td></td>表示列，一个<td></td>就是一列
|
1
2
3
4
5
6
7
8
9
10
11
12
|
<
table
>
<
tr
>
<
td
>IP</
td
>
<
td
>IDC</
td
>
<
td
>Status</
td
>
</
tr
>
<
tr
>
<
td
>172.16.2.5</
td
>
<
td
>cn-bj2</
td
>
<
td
>running</
td
>
</
tr
>
</
table
>
|
制作带边框的表格
|
1
2
3
4
5
6
7
8
9
10
11
12
|
<
table
border
=
'1'
>
<
tr
>
<
td
>IP</
td
>
<
td
>IDC</
td
>
<
td
>Status</
td
>
</
tr
>
<
tr
>
<
td
>172.16.2.5</
td
>
<
td
>cn-bj2</
td
>
<
td
>running</
td
>
</
tr
>
</
table
>
|
title格式：有时候我们希望第一行的内容为标题，文字居中，字体加粗，可以使用<th></th>标签
|
1
2
3
4
5
6
7
8
9
10
11
12
|
<
table
>
<
tr
>
<
th
>IP</
th
>
<
th
>IDC</
th
>
<
th
>Status</
th
>
</
tr
>
<
tr
>
<
td
>172.16.2.5</
td
>
<
td
>cn-bj2</
td
>
<
td
>running</
td
>
</
tr
>
</
table
>
|
合并单元格：
1、左右合并单元格：
左右合并单元格时，第一行就少一列字段，colspan='2'，代表把两列合成一列
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
<
table
border
=
"1"
>
<
tr
>
<
th
colspan
=
"2"
>IP</
th
>
<
th
>Status</
th
>
</
tr
>
<
tr
>
<
td
>172.16.2.5</
td
>
<
td
>cn-bj2</
td
>
<
td
>running</
td
>
</
tr
>
<
tr
>
<
td
>172.16.2.12</
td
>
<
td
>cn-bj2</
td
>
<
td
>running</
td
>
</
tr
>
</
table
>
|
2、上下合并单元格
|
1
2
3
4
5
6
7
8
9
10
11
|
<
table
border
=
"1"
>
<
tr
>
<
td
rowspan
=
"2"
>IP</
td
>
<
td
>IDC</
td
>
<
td
>Status</
td
>
</
tr
>
<
tr
>
<
td
>IDC</
td
>
<
td
>Status</
td
>
</
tr
>
</
table
>
|
上下合并单元格时，第一行会多出一个字段，rowspan='2'，表示把上下两行的单元格合并成一个单元格
fieldset标签
fieldset是用来将元素进行分组。
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
<
fieldset
>
<
legend
>新用户注册</
legend
>
<
p
>
用户名：<
input
type
=
"text"
/>
密码：<
input
type
=
"text"
/>
</
p
>
<
p
>
邮箱：<
input
type
=
"text"
/>
</
p
>
<
p
>
手机号：<
input
type
=
"text"
/>
</
p
>
<
p
>
<
input
type
=
"submit"
/>
</
p
>
</
fieldset
>
|
本文转自 曾哥最爱 51CTO博客，原文链接：http://blog.51cto.com/zengestudy/1892259，如需转载请自行联系原作者
