HTML5 第二阶段 第二天上午

day02 HTML5

• 列表标签

html中有有序列表（ol），无序列表（ul）不管何种列表，其中只能涵盖列表项标签（li）

，dl标签

1.有序列表

<ol></ol>有序列表标签，双标签，第一层嵌套只能包含<li></li>列表项标签，单独存在没有任何意义，块级元素，独占一行显示

<li></li>列表项标签，双标签，可以包裹任何标签和文本，块级元素

列表项前是有数字顺序，type类型1，A,a,i,I用来更改列表项的数字，type属性可以设置

type="1"默认

type="a"小写字母

type="A"大写字母

type="i"小写i

type="I"大写I

 

 

 

2.无序列表

<ul></ul>无序列表标签，双标签，第一层嵌套内只能包含列表项标签，块级标签，独占一行

<li></li>列表项标签，双标签，可以包裹任何标签和文本，块级元素

type类型disc ，square ， circle用来更改列表项的形状，type属性可以设置为

type="disc"默认的 实心圆

type="square"实心方块

type="circle"空心圆

 

 

 

3.自定义标签

<dl></dl>自定义列表，不仅是一列项目，而是项目及其注释的配合，双标签，块级元素

每个自定义列表项可以指定<dt></dt>列表标题，只能包括包裹文本

每个自定义列表项使用<dd></dd>双标签包括文本和元素

 

4.嵌套列表

当需要多级目录或多级列表时，可采用列表标签嵌套的方法，写法与普通列表书写方法一样，只是在列表项中再增加列表，列表嵌套结构因嵌套复杂，容易出错，

因此在书写中需要格外注意

 

 

• 表格标签

1.表格标签

<table></table>表格标签，双标签，可以包裹表格系列的标签

块级元素，对于表格往往应用于PC端分布局，手机端不可用table标签布局

<caption></caption>表格标题标签，双标签，只可以包裹文本，块级元素，独占一行，可以表格的标题，只能有一个，可以省略不写，如果写一定在<table></table>表格标签内嵌套的第一行出现

<thead></thead>表头标签，可以指定表格的列表表头，可不写

<tbody></tbody>表体标签，可以指定表格的主题部分，可不写

<tfoot></tfoot>表尾标签，可以指定表格的尾部说明，可不写

<tfoot></tfoot>标签必须被用在以下情景中，作为<table>元素的子元素，出现在<caption>和<thead>元素之后，<tbody>和<tr>元素之前

2.表格的行列

<tr></tr>行标签，双标签，只能包裹列标签和加粗列标签，可存在表头，表体，表尾中，代表一行的范围

<th></th>加粗列标签，一般放在表头，当做列标题使用，有居中的作用

<td></td>表格单元列标签，放置内容，比如文本和其他标签

  

3.表格标签的相关属性

<table></table>标签下的属性

border 像素，表格边框的宽度