列表分为
有序列表(ol)
无序列表（ul）
自定义列表（dl）
1.有序列表(ol):
（1.）内部必须有子标签<li>
( 2.) 天生自带内边距
2.无序列表（ul）
（1.）内部必须有子标签<li></li>
（2.）ul（无序列表）天生自带内外间距， p标签同样天生自带内边距
ul{border：1px solid red;}
p{border: 1px solid blue;}
并集选择器
格式：baby,ul,p {
margin:0;
padding:0;
"*"选择器有利有弊
利：
弊：加强浏览器的负荷
解决办法 按照要求进行选择
list-style 样式属性 除去列表前的符号
ul{
border:1px solid red
list-style;}
list-style的属性值 cirle（空心圆）disc（实心圆）square（正方形）none（空）
ol有序列表
1.内容必须有子标签<li>
2.天生自带内边距
ol和ul不同之前就在前面符号的区别
<ol type="A">有序列表改变前面的符号用type写在标签里面
<li>内容</li>
</ol>
用标签属性type修改
3.自定义列表
<dl>
<dt></dt>（小标题）
<dd></dd>（内容）
</dl>
Dl自定义列表 dt是小标题 dd内容
列表能做什么？
做二级菜单和导航
注：
Margin和padding问题是探讨
Margin：200px；设置一个值 说明top,right,nottom,left 都是200px
Margin: 200px 100px;设置两个值 上下是200px 左右是100px
Margin: 200px50px100px上是200px左右50px 下是100px
Margin：200px50px100px;上200px 右50px 下px 100px 右50px
Padding 同上
实际占用的空间大小
通过分析我们发现 一个元素实际占用的空间是
width+border*2+padding*2+margin*2
一个标签元素的实际高度
实际高度=height+padding-top+padding-bottom+2*border
Margin的塌陷现象是
相邻两个 块级 元素同时设置margin时，它们之间的外边距不会叠加，会取最大。这种现象叫做margin塌陷
有的标签设置背景时会独占一行，还有的会随着内容的增减而改变自己的空间大小。
5.标签分为块级标签和内敛标签(行级标签)
块级标签：会独占一行，无论内容多
块级：p h1-h6 div ul li ol dl等
内敛标签： 根据内容多少，占据空间大小
内敛：span img i b a em ico（矢量标签）
区别（块级和内敛）：
块级
1.块级元素会独占一行
2.块级可以设置宽高
内敛
1.内敛不会独占一样
2.内敛不可以设置宽高
3.内敛原色的margin上下不起作用
二者转换
块级转行级
给块级元素添加属性display:inline;display（显示）inline（行）
行级转块级
给行级元素添加属性：display:block----block块
行级转元级
给需要的元素添加属性：display:line-lock;
(可以设置宽高，可以在同一行 margin可以随便使用)
注：
line-height行高设置文字的垂直位置