手机
当前位置:查字典教程网 >网页设计 > Div+Css教程 >通过绝对定位实现div重叠实例代码
通过绝对定位实现div重叠实例代码
摘要:div重叠叠加实例未排层叠顺序www.divcss5.com.div-relative{position:absolute;color:#0...

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<title>div重叠 叠加实例 未排层叠顺序 www.divcss5.com</title>

<style>

.div-relative {position: absolute;color: #000;border: 1px solid #000;width: 500px;height: 400px;right: 0;bottom: 0;}

.div-a {position: absolute;left: 30px;top: 30px;background: #F00;width: 200px;height: 100px}

.div-b {position: absolute;left: 50px;top: 60px;background: #FF0;width: 400px;height: 200px}

.div-c {position: absolute;left: 80px;top: 80px;background: #00F;width: 300px;height: 300px;}

</style>

</head>

<body>

<div>

<div>我背景为红色</div>

<div>我背景为黄色</div>

<div>我背景为蓝色</div>

</div>

</body>

</html>

【通过绝对定位实现div重叠实例代码】相关文章:

CSS3正方体旋转示例代码

css3隔行变换色实现示例

DIV点击折叠实例代码

div内table居中实现代码

让网站变灰的css代码

div+css相对定位和绝对定位用法实例详解

CSS3制作ajax loader icon实现思路及代码

多步骤进度条的实现原理及代码

div图片marquee无缝连接实现代码

实现CSS3中的border-radius(边框圆角)示例代码

精品推荐
分类导航