web前端-HTML-列表标签

目标:能够使用无序列表、有序列表、自定义列表标签,实现网页中列表结构的搭建

1. 列表的应用场景

➢场景:在网页中按照行展示关联性的内容，如:新闻列表、排行榜、账单等

➢特点:按照行的方式,整齐显示内容

➢种类:无序列表、有序列表、自定义列表

1. 无序列表

➢场景: 在网页中表示一组无顺序之分的列表，如:新闻列表。

➢标签组成:

➢显示特点:

列表的每一项前默认显示圆点标识

➢注意点:

ul标签中只允许包含li标签

li标签可以包含任意内容

3. 有序列表

➢场景:在网页中表示- -组有顺序之分的列表,如:排行榜。

➢标签组成:

➢显示特点:

列表的每一项前默认显示序号标识

➢注意点:

ol标签中只允许包含li标签

li标签可以包含任意内容

4. 自定义列表

➢场景:在网页的底部导航中通常会使用自定义列表实现。

➢标签组成:

➢显示特点:

dd前会默认显示缩进效果

➢注意点:

dI标签中只允许包含dt/dd标签

dt/dd标签可以包含任意内容