您的位置:首页 > Web前端 > HTML

20160112html学习笔记表格列表

2016-01-12 14:28 1006 查看
可以用table标签在html文档里面定义表格,其具体规则为在table元素内用tr标签分割表格的行,用td标签分割表格的列.用th标签设置表头.可以设置table标签的border属性实现表格边框的设置,如果不设置border属性默认不显示边框.tr是table row的缩写,td是table data的缩写,th缩写为table header.具体例子如下:

<table border="0">

<th>th1</th>

<tr>

<td>td1</td><td>td2</td>

</tr>

</table>

实现了一个一行两列的表格.

可以在td或者th标签内设置rowspan和colspan属性实现单元格的跨行和跨列.其中colspan是column span的缩写.

table元素内可以嵌套(显示)文本图片表格段落等元素.

table标签里面的cellpadding决定表格内容与边框距离即格边距,cellspacing决定格与格之间的距离即格间距.

标签ol中有一个start属性可以设置序列开始值.例如start="50"有序表将从50开始计数.

需要注意dl与dt和dd的关系与用法,这里的dl是definition lists自定义列表的缩写,dt是definition term自定义表项 的缩写,而dd是definition description自定义表项定义的缩写.

这里的dl相当于一个容器类似于ul与ol的作用,而dt相当于标题,dd相当于标题的解释下面借用一个大神级别的应用实例:

<dl> 

 <dt >《千与千寻》</dt> 

 <dd>剧情说的是10岁的少女千寻与父母一起从都市搬家到了乡下。没想到在搬家的途中,一家人发生了意外。他们进入了汤屋老板魔女控制的奇特世界——在那里不劳动的人将会被变成动物。</dd> 

<dt>《龙猫》</dt>

 <dd>和爸爸一起搬到乡下的两姐妹,在家旁的一棵大树下发现了只有好孩子才能看见的TOTORO。  其间发生了很多不可思议而有趣的故事。</dd> 

</dl> 

可以通过设置ol标签里面的type属性值实现不同类型的标签,type值可以为A,a,I,i不设置type值默认为阿拉伯数字排序.

无序表类型有三种,可以通过设置ul里面的style属性值为list-style-type:cycle为空心圆list-style-type:square为实心方块,不设置则为实心圆.

可以在一个列表项里面嵌套另一个元素.可以多层嵌套.
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: