HTML5中的列表、表格

痞子三分冷 提交于 2020-01-13 09:00:33

表格

< ul >无序列表

可通过< ul >创建无序列表。
列表从< ul >开始,< /ul >结束中间的每个项可用< li >标签声明。
#注:ul标签结构的子标签建议只用< li >,li标签从< li >开始,< /li >结束

属性

ul 可以使用HTML中的全局属性(如class,id,style等)以及onclick属性(当点击按钮时执行一段任务)

< ol >有序列表

可通过< ol >创建有序列表
列表从< ol >开始,< /ol >结束中间的每个项可用< li >标签声明。
#注:ol标签结构的子标签建议只用< li >,li标签从< li >开始,< /li >结束。

属性

ol 可以使用HTML中的全局属性,以及onlick属性。
和三个如下属性

  1. type 指定使用哪一种类型的编号,1代表使用阿拉伯数字,a代表小写字母,A大写字母,以此类推。
  2. start 指定列表项的起始数字,默认是第一个(1,A,a)
  3. reversed 指定是否将排序翻转,该属性运用很少,目前只有 Chrome 和 Safari 6 支持 reversed 属性。
< li >列表项

包含于ul,ol内部的标签,从< li >开始,< /li >结束。可以包含文本,也可以包含其他标签构造盒子模型,用法与< div >类似。

< dl >术语列表

< dl >用于定义术语列表,只能包含< dt >< dd >两个子标签

属性

HTML中的全局属性 以及onclick属性

< dt >标签

定义标题列表项

属性

HTML中的全局属性 以及onclick属性

< dd >标签

定义标题列表项

属性

HTML中的全局属性 以及onclick属性

表格

表格通过< table >定义,于< table>开始,< /table>结束。

子元素

  1. < caption/ >定义表格标题
  2. < thead/ >定义表格头
  3. < tfoot/ >定义表格脚
  4. < tbody/ >定义表格主题
  5. < tr >定义表格行 只能包含< td >,< th >标签
  6. < th >定义表格头单元格,和tr标签很像,只是内部文本会居中加粗显示
  7. < td >定义该表格行内的单元格,其形式和div,li标签类似,可以嵌套加入很多其他标签组成
属性

#以上标签可以使用HTML中全局属性,以及onclick属性。
##前四个标签属于和标注类似功能的标签,不是表格中的必须标签。

###< td >标签存放的是表格的具体内容,其形式多元化,和div,li标签类似,可以嵌套加入很多其他标签组成盒子模型,它还有额外添加以下几个属性:

  1. colspan:指定该单元格夸多少列,值为简单数字
  2. rowspan:指定单元格可横跨的行数
  3. height:指定单元格高度,可以为像素值也可以为百分比
  4. width:指定单元格高度,可以为像素值也可以为百分比
其他

< col >标签可用来统一定义表格中的列(理论上有几个列就可以有几个< col >)
< colgroup >用于为表格中的一个或多个列指定属性值
(例< colgroud style=“background-color:white;” >代表定义所有列的背景色都是白色)
(< col style=“width:100px” >代表第一列改变了宽度(代码中打的第几个col就代表设置第几列))

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!