目标:能够使用无序列表、有序列表、自定义列表标签,实现网页中列表结构的搭建
1. 列表的应用场景
➢场景:在网页中按照行展示关联性的内容,如:新闻列表、排行榜、账单等
➢特点:按照行的方式,整齐显示内容
➢种类:无序列表、有序列表、自定义列表
无序列表
➢场景: 在网页中表示一组无顺序之分的列表,如:新闻列表。
➢标签组成:
➢显示特点:
列表的每一项前默认显示圆点标识
➢注意点:
ul标签中只允许包含li标签
li标签可以包含任意内容
3. 有序列表
➢场景:在网页中表示- -组有顺序之分的列表,如:排行榜。
➢标签组成:
➢显示特点:
列表的每一项前默认显示序号标识
➢注意点:
ol标签中只允许包含li标签
li标签可以包含任意内容
4. 自定义列表
➢场景:在网页的底部导航中通常会使用自定义列表实现。
➢标签组成:
➢显示特点:
dd前会默认显示缩进效果
➢注意点:
dI标签中只允许包含dt/dd标签
dt/dd标签可以包含任意内容