CSS层叠加的原则
静态定位：position:static（为position属性的默认值）。
动态定位：position:relative或position:absolute或position:fixed。
祖元素：任意包含该元素的元素。 父元素：直接包含该元素的祖元素。 同辈元素：拥有共同的父元素的元素。
注：这些概
念为作者自定义，仅用于本文。
引用:
关于同辈元素是个非常关键的词，这里还需要详细解释
一下。
<div>
<div></div>
<div id="a"></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
<div
id="f">
<div></div>
<div
id="b"></div>
<div id="c"></div>
<div></div>
<div></div>
<div></div>
</div>
在这个例子中，div#a与
div#b并不是“同辈元素”，只有像div#b和div#c这样拥有同样父体div#f的的元素才能叫“同辈元素”。
引用结束
接
下来看看这五条法则
：
法则一
：同辈元素定位方式相同，且无z-index设置
时，html靠后者居上。
法
则二
：同辈元素同为动态定位时，且有z-index设置时，z-index值大者居上。
猛点这里测试
法则三
：同辈元素定位方式不同时，动态定位居上。
猛点这里测试
法则四
：非同辈元素，任意一者及其祖元素不具备动态布局时，html靠后者居上。
猛点这里测试
法
则五
：【重要】非同辈元素，任意一者或其祖元素拥有动态定位时，同时各自向上寻找动态定位的祖元素，并分别从中拿出具备最高级别的祖元
素（或其本身）进行比较。
<div id="ab" style=
相关文档：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>CSS渐变条</ ......
如图，做网站时经常遇到的情况，将项目名和发布时间左右分开。
方法1：
思路是直接将时间放到一个行内元素里，然后将这个元素右浮动。
如：<li><span>(2009-01-01)</span>[媒体播放] KMPlayer
2.9.3.1428 中文正式版 </li>
只要将 li span{float:right；}，然后 li{width:200 ......
:hover是我们在CSS设计中最常运用的伪类之一，许多绚丽效果的实现离不开伪类:hover，比如我们常见的纯CSS菜单、相册效果等等。
或许用了这么久的伪类:hover，还有部分朋友还不完全了解hover的规则：
在CSS1中此伪类仅可用于a对象。且对于无href属性（特性）的a对象，此伪类不发生作用。
在CSS2中此伪类可以应用于任何对� ......
Css中的条件样式表
<!--[if lte IE 6 ]>
<link rel="stylesheet" href="ie6.css" mce_href="ie6.css" media="all"
type="text/css"/>
<![endif]-->
<!--[if IE 7]>
<link rel="stylesheet" href="ie7.css" mce_href="ie7.css" media="all"
type="text/css"/>
<
