html怎么让两个div重叠,两个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”。

一、未排序、为排倒叙DIV层叠堆叠实例

1、残破HTML源代码如下:

html>

div堆叠 叠加实例 未排层叠步调 css5.com.cn

.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背景色彩为蓝色 */

我后援为血色
我布景为黄色
我后援为蓝色
  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值