html文档的视觉显示包含很多变量：字体、颜色、间距等。css标准列举了这些变量。我们称之为样式属性。css定义了这些属性以指定字体、颜色、外边距、边框、背景、图片、文本对齐方式、元素尺寸和元素位置。为了定义HTml元素的视觉表现，规定了这些CSS属性的值。
当浏览器厂商实现非标准css属性时，他们用将属性名前加了一个厂商前缀，firefox使用-moz-，chrome使用-webkit-，而ie使用-ms-，他们甚至用这种方式来实现将来会实现标准化的属性。有个例子是border-radius，它用来指定元素的圆角，（在firefox3和safari 4中使用了前缀，后面的版本都去掉了前缀，ie9也支持没有前缀的border-radius，但是在ie8中即使有前缀也不支持）
在不同的浏览器中有不同名字的css属性一起工作，你可能发现为一个属性定义一个类方式比较好
.radius10{ border-radius:10px;/*现代浏览器*/ -moz-border-radius:10px;/*firefox 3.x*/ -webkit-border-radius:10px;/*safari 3.2和4*/ }
css的position属性：
static元素的默认属性，指定元素按照常规的文档内容流进行定位，静态定位的元素不能使用top、left和类似其他属性定位
欲对文档元素使用css定位技术，必将其postion属性设置为除此之外的其他3个属性
absolute该值指定元素是相对于包含它的元素进行定位。相对于所有其他的元素，绝对定位的元素是独立定位的，它不是静态定位的元素中文档流的一部分，它的定位要么是相对于最近的定位祖先元素，要么是相对于文档本身。
fixed
该值指定元素是相对于浏览器窗口进行定位的。固定定位的元素总是显示在那里，不会随着文档其他部分而滚动。类似绝对定位的元素，固定定位的元素和所有其他元素是独立的，它不是文档流的一部分。大多数现代浏览器支持固定定位，除了ie6
relative
当position属性设置为relative，元素按照常规的文档流进行布局，它的定位相对于在它文档流中的位置进行调整。系统保留着元素咋正常文档流中的空间，不会因为要填充空间而将其各边合拢，也不会将元素从新的位置推开。
一旦设置了元素的position属性为除了static以外的值，就可以通过元素的left、top、right和bottom属性的一些组合指定元素的位置。最常用的定位技术是使用left和top属性指定元素的左边缘到容器（通常是文档本身）左边缘的距离，元素的上边缘到容器上边缘的距离
如果元素使用绝对定位，它的top和left属性应该解释为它相对于其position属性设置为除static值以外的祖先元素。如果绝对定位的元素没有定位过的祖先，则它的top和left属性使用文档坐标进行度量-就是相对于文档左上角的便宜量。如果你想相对于一个属于常规文档流中的容器绝对定位一个元素，则将容器的position指定为ralative，top和left指定0px。这就让容器变成了动态定位，但它仍留在文档流中原来的位置。任何绝对定位元素的子元素都相对于容器进行定位
定位一个元素让其右，上边缘相对于窗口右，上边缘各10像素，并且不随文档的滚动而滚动，可以使用如下样式
positon:fixed;right10px;top:10px;
除了定位元素以外，css允许指定它们的尺寸，这通常通过指定width和height样式属性的值完成
另外一种指定元素的宽度的方法是同时指定left和right属性，同样，通过指定top和bottom属性来指定元素的高度。但是如果同时指定left，right和width，那么width属性将覆盖right的属性；如果元素的高度重复限定，height属性优先于bottom属性，没必要给每个动态元素指定尺寸，某些元素（如图片）具有固有尺寸。而 且，对包含文本或其他流式内容的动态元素通常指定想要的宽度就够了，让元素内容布局来自动决定它的高度。
css允许指定元素的位置和尺寸为其容器元素（或浏览器窗口）的百分比
第三个维度：z-index
属性定义了第三个维度：它允许指定元素的堆叠次序，并指示两个或多个重叠元素中的哪一个应该绘制在其他的上面。z-index默认为0，可以是正或负的整数，当两个或多个元素重叠在一起时，他们是按照从低到高的z-index顺序绘制的，如果重叠元素的z-index值一样，他们按照在文档中出现的顺序绘制，也即最后一个重叠的元素显示在上面
注意，z-index只对兄弟元素（例如，同一个容器的子元素）应用堆叠效果。如果两个元素不是兄弟元素之间的重叠，那么设置它们的z-index属性无法决定哪一个显示在上面，想反，必须设置这个两个重叠元素的兄弟容器的z-index属性来达到目的。
非定位元素（例如，默认使用positon：static定位）总是以防止重叠的方式进行布局，因此z-index属性不会应用到他们上面。尽管如此，他们默认的z-index值为0，这意味这z-index为正值的定位元素显示常规文档流的上面，而z-index为负值的定位元素显示在常规文档流的下面
原文：http://www.cnblogs.com/yhf286/p/5140358.html