学习DIV CSS基本结构，轻松掌握网页布局技巧？

复盘一下。 还记得我们刚开始接触网页制作那会儿吗？那种心情既兴奋又迷茫。我们总是先考虑怎么设计， 脑子里装满了那些绚丽的图片、个性的字体、斑斓的颜色，以及各种天马行空的布局方案。这当然没错，毕竟视觉是人类感知世界的第一窗口。但是当我们真正坐下来手指敲击键盘试图把这些想法变成代码时往往会发现事情并没有想象中那么简单。上面说的只是最基本的结构，实际应用中，你可以根据需要来调整内容块，但前提是你得先掌握那个“骨架”。

真正的网页除了外观表现之外还需要结构标准语言和行为标准的结合。这听起来有点像是在讲大道理，但请相信我，这绝对是让你少走弯路的关键。如果你希望你的HTML页面用CSS布局， 你需要回头重来先不考虑“外观”，要先思考你的页面内容的语义和结构。外观并不是最重要的。一个结构良好的HTML页面可以以任何外观表现出来CSS Zen Garden就是一个典型的例子。CSS Zen Garden帮助我们到头来认识到CSS的强大力量。HTML不仅仅只在电脑屏幕上阅读， 你用手机、用PDA，甚至在未来的某种可穿戴设备上，结构依然稳固，而皮肤可以随意更换。

告别Table， 拥抱DIV：思维的痛苦转变

说实话，从Table布局转到DIV+CSS，对于很多老手来说都是一种“阵痛”。以前我们习惯用表格来画格子，把内容塞进去，虽然代码乱七八糟，但至少所见即所得。而现在我们要面对的是一堆冷冰冰的``标签。#float#table#borderHTML JS 网页设计学习与技巧专栏收录该内容178 篇文章，这说明了什么？说明大家都在摸索，都在经历这个过程，探探路。。

在网页制作时采用层叠样式表技术， 可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。只要对相应的代码做一些简单的修改，就可以改变同一页面的不同部分，或者页数不同的网页的外观和格式。这种“牵一发而动全身”的快感，一旦你体验过就再也回不去了。