padding,margin,清除li前面的小圆点,布局技巧,content

padding
内边距
盒子边框到内容之间的距离
1个值 四边
2个值 10px 20px 上下 左右
3个值 上 左右 下
4个值 上 右 下 左
属于盒子的一部分 影响盒子真实大小
块元素有高度的情况下,设置内边距,要把高宽减去内边距
margin
盒子与盒子之间的距离
使用步骤
margin:10px 上右下左
margin:10px,20px 上下 左右
margin:10px,20px,30px 上 左右 下
margin:10px,20px,30px,40px 上 右 下 左
兄弟关系垂直坍塌
取较大的值为结果
只给一个设置就好
父子关系塌陷
子盒子设置上边距,导致父盒子跟子盒子一起掉下来
解决
父盒子设置上边距
父盒子设置上内边距
overflow:hidden
清除li前面的小圆点:list-style: none (这个参数要放在ul里面修饰)

布局技巧
学会使用浏览器查看盒子模型并调试
水平居中
块元素
margin:auto;
块元素要有宽度
行内,行内块,文字
父盒子使用text-align:center
垂直居中
height=line-height
content
width
height