WTAaron跟着李南江学习HTML5—CSS学习

之前有了解到以前大部分网页布局都是用的table表格布局，这样虽然可以缩短一点开发周期，内容可以自适应，但是如果遇到网页重新布局或者嵌套表格的话就会让开发维护人员很头疼了。而现在普遍使用div盒子模型布局可以很好的做到内容和表现分离，便于维护。这几天抽时间把李南江老师的css视频学习了一下，还是那么细致入微，深入浅出，总之一切为了学生好的事，老师都做到了。

使用div+css布局，我们在开发一个页面的时候可以按照一个标准的文档流把页面的各个部分按照从上到下的顺序进行布局，然后再通过浮动[浮动会导致元素脱离文档流，元素会浮动到父亲元素的边缘或其它浮动元素的边缘，如果遇到空间不够就会下降寻找足够的空间，浮动一般伴随着清除，清除会让元素的左右没有任何浮动元素]和定位[(可以修改框盒子的定位方式，static（正常的文档流中的位置）、absolute（相对于最近一个被定位（非static定位）了的祖先元素的位置，脱离了文档流）、relative（相对于正常的文档流的位置，保留原来的位置）、fixed（相对于窗口，脱离了文档流）]来调整页面布局。CSS(Cascading Style Sheets)就是用来表现HTML的一种声明式语言，它具有层叠性和继承性，它拥有很多属性，比如设置字体颜色color、文本居中、背景图片。。，一般div+css常用到的几个属性如下：

Float:      Float属性是DIV+CSS布局中最基本也是最常用的属性，用于实现多列功能，我们知道标签默认一行只能显示一个，而使用Float属性可以实现一行显示多个div的功能，最直接解释方法就是能实现表格布局的多列功能。

Margin:

Margin属性用于设置两个元素之间的距离。

Padding:

Padding属性用于设置一个元素的边框与其内容的距离。

Clear:

使用Float属性设置一行有多个DIV后（多列），最好在下一行开始之前使用Clear属性清楚一下浮动，否则上面的布局会影响到下面。

css一个强大的地方就在于它丰富的选择器，可以让我们更快捷的找到并操作dom元素，不论是设置一些静态样式还是做一些动态效果都很方便。基本的选择器有：id选择器(#id)、类选择器(.class)、标签选择器。还有子元素选择器、兄弟元素选择器，伪类选择器、后代选择器、序列选择器等等。

学习css除了要记住它那丰富的属性之外，还要学会利用多个属性之间的配合来实现我们想要的效果，只有多练习，碰到问题解决问题，你才能在网页布局开发中得心应手。

学HTML5就选李南江，选培训机构我只选小码哥（www.520it.com）