两个DIV或多个DIV顺序重叠加

DIV堆叠 CSS让DIV层叠、叠加，CSS让两个DIV或多个DIV按程序堆叠叠加篇

让DIV重叠并按想要举措重叠须要CSS来实现，即CSS绝对定位发展实现。

重叠格局必要主要CSS名目抒发
1、z-index 重叠挨次属性
2、position:relative和position:absolute设置装备摆设对象属性为可定位（可堆叠）
3、left right top bottom绝对定位详细位子设置

配合的花式
1、css width
2、css height
3、bac公斤round 为了考查效果，咱们对不合DIV设置装备摆设差距布景色采发展区别

尔后我们为大家奉上DIV按自身意愿堆叠、叠加实例构造。咱们新建4个DIV盒子，一个大的DIV盒子，CSS定名为“.div-relative”，三个小DIV盒子放于第一个大DIV对象盒子内，DIV定名分袂为“.div-a”、“.div-b”、“.div-c”。

1、残破HTML源代码如下：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>div堆叠叠加实例未排层叠步调 css5.com.cn</title>
<style>
.div-relative{position:relative; color:#000; border:1px solid #000; width:500px; height:400px}
.div-a{ position:absolute; left:30px; top:30px; bac千克round:#F00; width:200px; height:100px}
/* css注释说明：后台为赤色 */
.div-b{ position:absolute; left:50px; top:60px; bac公斤round:#FF0; width:400px; height:200px}
/* 布景为黄色 */
.div-c{ position:absolute; left:80px; top:80px; bac千克round:#00F; width:300px; height:300px}
/* DIV背景色彩为蓝色 */
</style>
</head>
<body>
<div class="div-relative">
<div class="div-a">我后援为血色</div>
<div class="div-b">我布景为黄色</div>
<div class="div-c">我后援为蓝色</div>
</div>
</body>
</html>

如需转载，请注明文章出处和来源网址：http://www.divcss5.com/jiqiao/j51728.shtml