W3C标准：
由万维网联盟制定的一系列标准，包括：
结构化标准语言（HTML和XML）
表现标准语言（CSS）
行为标准语言（DOM和ECMAScript）
倡导结构、样式、行为分离。
CSS 规定的定位机制有三种，分别是标准文档流、浮动及绝对定位。
标准文档流
特点：从上到下，从左到右，输出文档内容，由块级元素和行级元素组成
块级元素：从左到右撑满页面，独占一行，碰到页面边缘时会自动换行
常见的块级元素：div ul li dl dt p...
行级元素：能在同一行内显示，不会改变HTML文档结构
常见的行级标签：span strong img input...
块级元素和行级元素，二者都是盒子模型
盒子模型
盒子模型＝网页布局的基石，由四部分组成：
边框（border）
外边距（margin）
内边距（padding）
盒子中的内容（content）
盒子模型尺寸＝边框＋外边距＋内边距＋盒子中的内容尺寸
当你想让页面自动居中并使用margin:0 auto时，就不能使用浮动或者绝对定位属性了，不然margin设置的自动居中会失效。
float属性
有3个属性值：left、right、none
特点：元素会左移，或右移，直到碰触到容器为止
设置了浮动的元素，仍旧处于标准文档流中
清除浮动的方法：
clear属性－－常用clear:both
clear:left;clear:right
同时设置width:100%（或固定宽度）＋overflow:hidden;
横向两列布局
网页布局最常见的方式之一
主要应用技能：float属性--使纵向排列的块级元素，横向排列
margin属性--设置两列之间的间距
如果使用了浮动，使当前层的父层看不到且后面的层受到影响，可以对父层使用overflow:hidden或者后面的层使用clear:both来清除浮动。
绝对定位布局
通过设置position属性实现，是CSS中规定的第三种定位机制，能够实现横向多列布局及较为复杂的定位，如带有遮罩层效果的提示框、固定层效果、全屏广告等。
position属性拥有3种定位形式：1 静态定位（static）2 相对定位（relative）3 绝对定位（absolute、fixed）
相对定位
特点：相对于自身原有位置进行偏移，仍处于标准文档流中，随即拥有偏移属性和z-index属性
绝对定位
特点：建立了以包含块为基准的定位，完全脱离的标准文档流，随即拥有偏移属性和z-index属性
未设置偏移量特点：无论是否存在已定位祖先元素，都保持在元素初始位置，且脱离了标准文档流
设置偏移量：偏移参照基准：无已定位祖先元素，以<html>未偏移参照基准，已有定位祖先元素，以距其最近的已定位祖先元素为偏移参照基准
横向两列布局
使用absolute实现横向两列布局--常用于一列固定宽度，另一列宽度自适应的情况
主要应用技能：relative--父元素相对定位 absolute--自适应宽度元素绝对定位
注意：固定宽度列的高度>自适应宽度列的高度
497
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
