一、基础概念
W3C标准：由万维网联盟制定的一系列标准：包括：
结构化标准语言（HTML和XML）；
表现标准语言（CSS）；
行为标准语言（DOM和ECMAscript）。
倡导结构，样式，行为分离。
CSS中的定位机制：
1、标准文档流（Normal flow）：从上到下，从左到右，输出文档内容，由块级元素（从左到右撑满页面，独占一行；触碰到页面边缘时，会自动换行。常见块级元素：div、lu、li、d、dt、p……）和行级元素(能在同一行内显示，不会改变HTML文档结构。常见行级元素：span、strong、img、input……)组成。
2、浮动（Floats)：
3、绝对定位（Absolute positioning）：
盒子模型：网页布局的基石，有四部分组成：
边框（border）、外边距（margin）、内边距（padding）、盒子中的内容（content）。如下图：
盒子的尺寸=边框+外边距+内边距+盒子中的内容尺寸
注：块级元素和行级元素都是盒子模型。
盒子3D模型：
常见页面布局及解决方案：
二、自动居中一列布局
关键词：标准文档流，块级元素，margin属性
自动居中一列布局需要设置margin左右值为auto，而且一定要设置宽度为一个定值。
auto会根据浏览器的宽度自动地设置两边的外边距
如果想让页面自动居中，当设置margin属性为auto的时候，不能再设置浮动和绝对定位属性
代码示例：
一列布局固定：
XML/HTML Code复制内容到剪贴板一列布局 -