一、css布局的方式：
1、默认的，就是按文档流的顺序，即按html的结构顺序。
2、浮动方式：
3、定位方式：
二、浮动
1、浮动是将，块元素的，霸道属性，即独占一行的行为，取消，允许别人与他一行。
浮动的核心思想：浮动其实是，这个块，从原来的文档流模式中，分离出来，它后面的对象，就视它不存在。
浮动口诀：浮动浮动，先浮后动，先浮，就是浮动的对象，会先飘起来，即离开原来的位置；后动，就是它后面的对象，会向它原来的位置上，动起来。
2、常用的布局效果，例如，一行并列式，就是在一行中，显示几个块元素，如何实现的呢？
答：如果想让，多个块，显示在同一行中，可以将，这些块，都设置为浮动，并且浮动方向相同。
3、css把网页元素，分为两类，一种是块，一种是内联元素。
body，div，p，h1都是块
ul与li默认情况下是块元素，要想让他们在一行中显示，就要用到浮动。
4、如果有两个div1和div2，div1左浮动后，如何让div2内的文字或图片显示出来（即显示在div1同一行的后面）？
答：d i v 2 的 w i d t h ≥ d i v 1 的 w i d t h + d i v 2 内文字或图片的宽度 ，
否则就显示不出来（图片显示不出来，文字还在原来的位置不动）
5、如何知道有没有兼容性？
答：我们在制作时，你多使用不同的浏览器查看你的结果，这样，你就能知道，各种浏览器的差别。
总结出，当IE6父元素，中的子元素，的高度超过了，父元素的高度，IE6默认，会把父元素的高度，自动增加。
三、清除浮动
：就是可以去掉前面对象浮动，对后面对象的影响。
1、为什么要清除浮动？
答：当元素有浮动属性时，会对其父元素或后面的元素产生影响，会出现一个布局错乱现象，
可以通过清除浮动的方法来解决，浮动元素的影响。
2、清除对后面元素的影响
清除浮动的方法：
在后面元素样式中加上 clear：both
补：属性：clear
属性值：none 默认值，允许两边都可以有浮动对象
left 不允许左边有浮动对象
right 不允许右边有浮动对象
both 左右两边都不允许有浮动对象
2、清除对父元素的影响
清除浮动的3种方法：都是给父元素的样式里加的
（1）额外标签法：增加一个空标签，就是没有内容的标签。
这种方法应该说是最简单的一种，是W3C组织推荐的方法，
W3C建议在（父）容器的末尾增加一个“clear:both”的元素，强迫容器适应它的高度以便装下所有的float元素
<div id="main">
<div id="left">左盒子</div>
<div id="right">右盒子</div>
<div class="clear"></div> /*增加一个空的div，然后在css样式表中写 .clear{clear:both;}*/
</div>
<div id="footer">底部</div>
缺点：会增加代码（即有一个父元素需要清除浮动，你就需要加一个空标签）。
（2）父元素使用overflow的方法：给父元素，加overflow:hidden （至于为什么，不太明白）
缺点：如果子元素使用了定位布局，就会很难实现。
补： (1) css中溢出的使用
功能：设置当对象的内容超过其指定高度及宽度时如何管理内容（即如何管理超出的部分）
用法：overflow：visible （默认值，不剪切内容，也不添加滚动条，即超出就超出）
auto （在必需时对象内容才会被裁切或显示滚动条）
hidden （不显示超过对象尺寸的内容）
scroll （总是显示滚动条）
(2)zoom：只用IE内核的浏览器支持，原来是指缩放比例
功能：设置或搜索对象的缩放比例
用法：normal（默认值，即使用对象的实际尺寸）
百分数 如zoom：0.5，表示是实际尺寸的百分之五十大小
zoom:1 解决IE6高度自适应问题
（3）利用伪对象after方法：定义一个类，使用伪对象after，控制浮动元素的影响
网上最流行的清除浮动方法：
.clearFix:after{
clear:both;
display:block;
visibility:hidden;
height:0;
line-height:0;
content:"";
}
.clearFix{zoom:1;} /*解决IE6/7兼容问题*/
补：:before和:after属于一种伪对象，它是可以加给某个标签的；content后面是你要加的内容
语法：标签:after{"要加的内容";}
例如：
css样式中
p:before{content:"我是在前面加的内容";}
p:after{content:"我是在后面加的内容";}body中
<p>[我是原p标签中的内容]</p>
3、为什么，原来在一行中的两个块，会因为浏览器窗口的大小改变，而改变其原来的位置，如何解决？
答：当浏览器窗口宽度不能放下左右div宽度之和时，右边div被挤到左边div的下边
解决方法：在左右两个块外面，加一个父元素，用于控制它们的整体宽度
4、设置一个块为水平居中时，都会给这个块设置一个宽度值。
（因为如果不设宽度，它默认宽度就会平铺整个浏览器宽度，居中不居中就没意义了。）
即水平居中要满足2个条件：
【1】设置一个宽度值width
【2】设置 margin：0 auto；（即设置左右margin为auto ，上下margin不一定非是0任意值都可以）
5、当父元素，没有指定，高度时，并且，它的子元素有浮动，这时，这个父元素的高度不会自动增加。
四、定位布局
1、当我们要想使用绝对定位时，必须要有两个条件：
【1】必须给父元素加定位属性，一般建议使用 position:relative;
【2】给子元素，加绝对定位 position:absolute;同时要加方向属性。
2、相对定位与绝对定位区别：
（1）绝对定位时以父元素为基准点，进行定位---会脱离文档流。
绝对定位写法：
父元素 position:relative;
子元素 position:absolute;
top:100px;
left:100px;
（2）相对定位时根据其自身为基准点，进行定位---离开原位置，但还占着原来的空间。
相对定位的写法：
子元素 position:relative;
top:100px;
left:100px;
3、图片是像块元素的内联元素，但是它可以加宽高
4、有些html元素标记，有默认的内外边距
5、一般而言，当设置了一个块的宽度后，需要设置与之并列的块的宽度，才能保证样式正常显示。
今天是我的生日，作家李玲瑶说学习是送给自己最好的礼物，所以这篇文章就是我送给自己的生日礼物了，哈哈。
2014.12.3