所有CSS布局技术都是建立在4个最基本的概念之上，它就是“盒模型、流动、浮动和定位”这四个。千变万化的技巧应用其实都是这些基本概念在舞动，如果理解了核心概念的真谛，那么创建CSS布局实际上就是按图索骥了。
CSS布局的基本思路
在初学习网页制作时，首先考虑的是怎么设计，考虑那些图片、字体、颜色、以及布局方案。然后用Photoshop或Fireworks等工具画图、再切成小图，最后通过编辑HTML将所有设计还原表现在页面上。
如果要用CSS布局，思路恰恰相反，你不需要先考虑网页的外观和布局设计，而是先思考网页信息的语义和结构。那么什么是语义呢？
语义又称做词义，用中文也可以表示字义，它研究的对象是词语，而不是语句或文章，在Web中可以理解为构建网页的各种元素，这些元素的名称应该富有语义，即构建网页框架的元素应体现一定的意思，例如，HTML中的p元素，这个元素的名称p全称为paragraph（段落的意思），那么我们一看到这个元素，就知道它包含的内容应该是文本段，关于结构语义化元素更详细的说明读者可以参考2.1.5节内容。而结构就是由这些语义元素组合搭建起来的框架，所呈现出来的就是网页效果了。
语义Web（语义网）是W3C倡导下的协作项目，它提供了一个通用的框架，允许跨越不同Web应用程序、企业和团体共享和重用数据，这与微软公司所倡导的.NET第三代互联网技术平台思想是一致的。
从元数据角度分析，语义Web的基本思想就是让网页上的数据都有元数据（网页元素）来描述它，说明它的含义，这样计算机程序就能够理解网页上的数据，也能更好地为大家服务；从数据交换角度分析，这样更方便用户数据的交换，此时你会更加理解为什么XML语言是Web数据交换的基本格式；从Web搜索角度分析，目前的网页是让人看的，如查找信息、网上购物等，语义Web上的网页是让计算机看的，它通过制定一个Web上数据表示语言的规范，用以描述Web内容，且让计算机能够理解，例如，计算机遇到p元素就知道其中包含的内容是段落文本，遇到h1～h6就知道是标题一样等。
如果要用CSS布局，思路恰恰相反，你不需要先考虑网页的外观和布局设计，而是先思考网页信息的语义和结构。那么什么是语义呢？
语义又称做词义，用中文也可以表示字义，它研究的对象是词语，而不是语句或文章，在Web中可以理解为构建网页的各种元素，这些元素的名称应该富有语义，即构建网页框架的元素应体现一定的意思，例如，HTML中的p元素，这个元素的名称p全称为paragraph（段落的意思），那么我们一看到这个元素，就知道它包含的内容应该是文本段，关于结构语义化元素更详细的说明读者可以参考2.1.5节内容。而结构就是由这些语义元素组合搭建起来的框架，所呈现出来的就是网页效果了。
语义Web（语义网）是W3C倡导下的协作项目，它提供了一个通用的框架，允许跨越不同Web应用程序、企业和团体共享和重用数据，这与微软公司所倡导的.NET第三代互联网技术平台思想是一致的。
从元数据角度分析，语义Web的基本思想就是让网页上的数据都有元数据（网页元素）来描述它，说明它的含义，这样计算机程序就能够理解网页上的数据，也能更好地为大家服务；从数据交换角度分析，这样更方便用户数据的交换，此时你会更加理解为什么XML语言是Web数据交换的基本格式；从Web搜索角度分析，目前的网页是让人看的，如查找信息、网上购物等，语义Web上的网页是让计算机看的，它通过制定一个Web上数据表示语言的规范，用以描述Web内容，且让计算机能够理解，例如，计算机遇到p元素就知道其中包含的内容是段落文本，遇到h1～h6就知道是标题一样等。
