CSS中div覆盖另一个div
将一个div覆盖在另一个div上有两种手段：一是设置margin为负值，二是设置绝对定位。
可以根个人情况设置z-index的值
1->position 为absolute的情况
<html>
<head>
<style>
#div1{position:absolute;width:300px;height:300px;background:#ccc;}
#div2{position:absolute;left:0;top:0;width:200px;height:200px;background:red;filter:alpha(opacity=50);}
</style>
</head>
<body>
<divid="div1">这里是div1的内容
<divid="div2"></div>
</div>
</body>
</html>
2->用margin为负的操作
<html>
<head>
<style>
#div1 { position:relative; width:300px; height:300px; background:#ccc;}
#div2 { position:relative; left:0; top:0;margin-top:-15px; width:200px; height:200px; background:red;filter:alpha(opacity=50);}
</style>
</head>
<body>
<divid="div1"> 这里是div1的内容
<divid="div2"></div>
</div>
</body>
</html>
转载于:https://www.cnblogs.com/hujunzheng/p/4998640.html
CSS中div覆盖另一个div相关推荐
- html中div的覆盖,CSS中如何使div覆盖另一个div的实例
将一个p覆盖在另一个p上有两种手段:一是设置margin为负值,二是设置绝对定位. 可以根个人情况设置z-index的值 1->position 为absolute的情况 #p1{positio ...
- 【CSS】一个div在另外一个div中居中显示（水平居中，竖直居中）
一个div在另外一个div中居中显示(水平居中,竖直居中) 方法1: 通过设置子元素绝对定位和margin:auto .parent {position:relative;width:800px;he ...
- html5 居于页面中心,css笔记：如何让一个div居于页面正中间
如何让一个div居于页面中间,我今天说的是让一个div水平居中同时垂直居中,而不是简单的top:50%,left:50%.当然,我们就按一开始的思路写一下:top,left属性都设为50%,看一下效果 ...
- [css] 如何使用css3实现一个div设置多张背景图片？
[css] 如何使用css3实现一个div设置多张背景图片? background-image:url("1.jpg"),url("2.jpg"),url(&q ...
- hover一个div展示另一个div
hover一个div展示另一个div 效果图: hover前: hover后: 效果: 代码: <!DOCTYPE html> <html lang="zh-cn" ...
- html首行缩进在CSS中的代码,如何在div+css实现首行缩进
用word文档实现段落首行缩进是一件相当容易的事,你只需打开段落对话框,在里面进行相关设置即可.那么在div+css中该如何实现呢?今天我们一起来学习一下. 所谓首行缩进,就是每段前空两个汉字.所以在 ...
- css相对位置之两个同级div下一个div相对上一个div的位置
方式一: <div class="main">main </div> <div class="btn">靠左上角 </ ...
- div 固定不动 另一个div 有滚动条，position: relative的用法
div 固定不动在顶端, 另一个div 的内容可以滚动显示,position: relative的用法 关键的代码: 1.给父辈Div添加的基本属性:position: relative 2.确定不会 ...
- css动画其他div,删除另一个div时的CSS3 Transition动画
如果您的div具有相似的高度,则可以这样做. 关键是为列表中第一项的边距高度设置动画. .test { left: 0px; top: 0px; width: 400px; height: 300px ...
最新文章
- 福利 | 13篇精选国外资源合集（技术指南、大咖经验、资源分享...）
- python3.6安装包多大_win10下Python3.6安装、配置以及pip安装包教程
- PaaS服务之路漫谈(二)：Monolithic架构分析
- [html] 如何让table的边框双线变单线？
- libjpeg在windows下的编译
- 【Flink】Flink WindowOperator大概工作流程
- sunplus8202V双无线游戏手柄设计
- Supervisor 自动管理进程
- android adb进入recovery模式,adb 进入 recovery adb 进入 bootloader
- 计算机硬件基础与计算机组装知识总结
- 单机：Oracle单机数据库一键安装（11GR2/12C/18C/19C/21C）
- Sqlite3 学习记录
- java 微信公众号乱码_(原创)开发微信公众平台遇到的乱码等问题的解决
- pdm生成java_PowerDesigner通过SQL语句生成PDM文件并将name和comment进行互相转换
- 直播api接口java_基于JAVA的电视台直播节目时间表api调用代码实例
- 有效沟通bic法则_在职场中有效沟通的法则
- ENVI统计值异常问题
- iOS 视图实现圆角效果的三种方法及比较
- 梁梦瑶 20190919-5 代码规范，结对要求
- python xlsxwriter下载_windows下安装Python的XlsxWriter模块