盒子模型
image.png
一个盒子的实际宽度、高度:content+padding+border+margin:
image.png
margin:
image.png
margin 合并(浏览器会合并):
image.png
文档流
元素分类
block 独占一行 元素的height、width、margin、padding都可设置 <div>、<p>、<h1>...<h6>、
<ol>、<ul>、<table>、<form>
inline
inline-block
浮动流
层定位
image.png
固定定位:
image.png
image.png
相对定位:
image.png
image.png
image.png
相对定位,与绝对定位一起使用
image.png