今天同事发现一个有意思的问题，关于position的层级关系的，他要不说我也没注意过
测试后果然有趣，有待深入研究：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Css中Position定位属性与层级关系</title>
<style type="text/css">
#W{
position: relative;
}
.a{position: absolute;}
#addTR{position: relative;width: 200px;height: 30px;background: seagreen;}
</style>
</head>
<body>
<div id="w">
<div id="addTR">
<p>文字</p>
</div>
<div class="a">
<img src="img/1.jpg"/>
</div>
<div class="a">
<img src="img/2.jpg"/>
</div>
<p style="margin-top: 500px;">
层级关系
<br /> 首先是遵循DOM的规则，同级的后面居上。<br /> 一般有定位属性的元素会高于无定位属性的同级元素。<br /> 都有定位属性的同级元素，z-index大者居上<br /> 如果是非同级的元素， 则会忽略元素本身z-index，取与对比元素同级的祖先元素的z-index属性，大者居上<br />
</p>
</div>
</body>
</html>
一个博主的回答：http://www.tuicool.com/articles/rmAzia
解释原文：http://www.elanblog.com/2014/03/04/postion-teach/
2017-04-18 15:13:12 end