CSS的核心：浮动、盒子模型、定位
DIV作为块级元素，每个DIV占据一行。
块元素特点：1.默认显示在父标签的左上角；2.块级元素默认占满一行（占满整个文档流）
常见的块级元素：p、h1-h6、ul li、ol li、div、table、hr等
相对应的是行内元素（内联元素）：a、span、img、input等
行内元素特点：1.大小受到文字区域影响，不受height、width影响；2.不会单独占据一行。
span标签的应用：不会单独占满一行，不会受到其他块级元素的影响
行内元素变为块级元素：display:block；
块级元素编程行内元素： display：inline；
display：inline-block；受到高宽影响，不会单独占满一行。（块级元素、行内元素均有效）
为了使两个DIV排列在一行，需要通过浮动来设置。
#d1
{
float：left
}
去除块浮动的影响
{
clear:both; clear:left; clear:right
}
盒子模型（重点，做网页布局的基础）
border、margin、padding三要素
边框：border
border-top， bottom，left，right
padding:
padding:10px; （上下左右都撑开10px；写两个：上下、左右；写三个值：上、左右、下；写四个：上、右、下、左）
padding-top:10px; bottom, left, right
margin:
margin:10px; （上下左右） margin-top： left、right、bottom
对于行内元素，panding 各种情况支持
对于行内元素，margin部分有效，只支持左右，不支持上下
定位：
绝对定位：1.脱离文档流，不会单独占满一行，不会受到浮动的影响。2.当设置额绝对定位。元素方位受到窗体的上下左右影响；
{
position:absolute;
margin-top：150px；
margin-left：150px；
}
*
{
padding:0px; margin:0px;
}
相对定位：1.没有脱离文档流，会受到浮动的影响；2.当设置为相对定位时，方位是相对于元素的父标签；由于标签并没有脱离文档流，四周标签占位置
{
position:relative；
margin-top:10px；
margin-left:10px;
}
固定：
position:fixed
top:0px;
right:0px;
botton:0px;