南大软院二十一天成神计划

网页布局基础

       运用DIV加CSS进行网页布局是基础中的基础，本节课程老师主要讲解流式布局、浮动布局、绝对定位布局，其中包含盒子模型、float属性、position属性等知识点。老师运用三个案例让我们更加容易的理解了这几个知识点。

       运用盒子模型可以实现自动居中一列布局，用float属性实现横向两列甚至多列布局，以及如何解决浮动给其他模块带来的影响，绝对定位的方法可以和float属性达到相同的效果，我们可以根据不同的需求来选择。

      下面摘记一些我做的笔记，也就是自己需要掌握的地方：

1、如果一个元素没有设置宽度，而设置了float属性，宽度会随着内容的变化而变化，而且，设置浮动后，会对相邻的元素（特指紧邻后面的元素）产生影响。

2、清除浮动的方法：a 运用clear：both，可以清除影响，但是有些情况下不能起作用，就需要另外一种方法 b 同时设置width和overflow，例如：width：100%；overflow：hidden。

3、运用绝对定位时，使用absolute实现横向两列布局 ，常用于一列固定宽度，另一列宽度自适应。

     主要应用技能： relative----父元素相对定位

                               absolute----自适应宽度绝对定位

    在这里需要注意：固定宽度列的高度要大于自适应宽度的列。

暂时就学了这些，在后面编程挑战的时候运用的还不是特别熟练，需要回去看老师讲解，需要多运用，要学会灵活运用。