课时30.无序列表（掌握）
1.什么是列表标签？
列表标签的作用：给一堆数据添加列表语义，也就是告诉搜索引擎，告诉浏览器这一堆数据是一个整体
2.HTML列表标签的分类
2.1无序列表（企业开发中用到最多）（unordered list）
2.2有序列表 (企业开发中用的最少) （ordered list）
2.3定义列表 (企业开发中用的其次多) (definition list)
3.无序列表作用:
给一堆数据添加列表语义，并且这一堆数据中所有的数据都没有先后之分
什么叫有先后之分？
例如：排行榜
什么叫没有先后之分？
例如：中国有哪些城市
4.无序列表格式
<ul>
<li>需要显示的条目内容</li>
</ul>
li其实是英文list item的缩写
list是列表的意思，item是条目的意思，所以结合起来就是列表条目的意思
5.注意点
- 一定要记住ul标签是用来给一堆数据添加列表语义的，而不是用来给它们添加小圆点的
- 如何去除小圆点？
<head>
<style type="text/css">
ul {
list-style:none;
}
</head>
- 为什么企业开发中有序列表用的非常少？
因为有序列表能做的无序列表也能做，如在无序列表中添加序号：
<ul>
<li>1.广州</li>
<li>2.北京</li>
<li>3.上海</li>
<li>4.武汉</li>
</ul>
2.ul标签和li标签是一个整体，是一个组合，所以一般情况下ul标签和li标签都是一起出现，不会单个出现，也就是说不会单独使用一个ul标签或者单独使用一个li标签，都是结合在一起使用。
3.由于ul标签和li标签是一个组合，所以ul标签中不推荐包含其它标签，也就是说以后你在ul标签中只会看到li标签。
<ul>
<h2>中国的城市有哪些</h2>
<li></li>
<li></li>
</ul>
这种写法是不提倡的
- 无序列表应用场景：
- 新闻列表
- 商品列表
- 导航条
有人说导航条是横着的，列表是竖着的，无法出现这种效果，其实是可以的，但是需要用到css，在<head></head>之间写
li {
float:left;
background-color:yellow;
width:150px;
height:50px;
text-align:center;
line-height:50px;
}