.box{
width: 800px;
box-sizing: border-box;
margin: 50px auto 0;
background: pink;
}
.imgBox{
width: 80%;
height: 500px;
margin: 0 auto;
background: green;
}
.imgBoximg{
display: block;
width: 100%;
height: auto;
height: 500px;
}
.boxc{
width: 100%;
height: 300px;
background: #c00;
margin-top: -100px;
position: relative;
                   加入这行样式即可调整下面盒子的层级
}

  

<div class="box">
<div class="imgBox"> <img class="imgBoximg" src="img/plt1.png" alt="" />
</div>
<div class="boxc"></div>
</div>

  

关于上部盒子里有图片下面盒子magin-top负值的层级问题的更多相关文章

  1. jsDOM编程-小球在盒子里来回撞击

    首先写一个小页面:页面需要一个div 这个div就是盒子,然后在div里在包含一个子div 这个子div就包含一张小球的图片 代码: <!doctype html> <html> ...

  2. 滑动门出现的背景---实例微信导航栏(a盒子里面包span盒子,文字写在span里)

    需求: 制作网页时,为了美观,常常需要为网页元素设置特殊形状的背景,比如微信导航栏,有凸起和凹下去的感觉,其中最大的问题是字数不同,如何做? 解决: 用一个a包含span来制作,字数放在span里面. ...

  3. r个有标志的球放进n个不同的盒子里,要求无一空盒,问有多少种不同的分配方案?

           由题意可知道r>=n,我原来想的是先取n个全排列,剩下的r-n个每个有n中选择,所以结果是n!*n^(r-n).经满神猜测,这样是会重复的.比如说,1到5个球,ABC三个盒子,ms ...

  4. 不要困在自己建造的盒子里——写给.NET程序员(附精彩评论)

    此文章的主旨是希望过于专注.NET程序员在做好工作.写好.NET程序的同时,能分拨出一点时间接触一下.NET之外的东西(例如10%-20%的时间),而不是鼓动大家什么都去学最后什么都学不精,更不是说. ...

  5. 今盒子里有n个小球,A、B两人轮流从盒中取球,每个人都可以看到另一个人取了多少个

    /* 题目描述 今盒子里有n个小球,A.B两人轮流从盒中取球,每个人都可以看到另一个人取了多少个,也可以看到盒中还剩下多少个,并且两人都很聪明,不会做出错误的判断. 我们约定: 每个人从盒子中取出的球 ...

  6. 怎么样子盒子能撑起父盒子?浮动,BFC,边距重叠

    怎么样子盒子能撑起父盒子? 从行内元素跟块元素来看: 一般情况下,行内元素只能包含数据和其他行内元素. 而块级元素可以包含行内元素和其他块级元素. 块级元素内部可以嵌套块级元素或行内元素. 建议行内元 ...

  7. 使用bootstrap网格系统自适应盒子宽度时保持所有盒子高度一致。

    使用了bootstrap网格系统的好处是很容易便实现了响应式布局,盒子可以根据设置的样式,随着屏幕的大小改变而自动改变宽度,但是也存在一个问题,那就是盒子的高度是由盒子的内容决定的,如果盒子里的内容不 ...

  8. 标准W3C盒子模型和IE盒子模型CSS布局经典盒子模型(转)

    盒子模型是css中一个重要的概念,理解了盒子模型才能更好的排版.其实盒子模型有两种,分别是 ie 盒子模型和标准 w3c 盒子模型.他们对盒子模型的解释各不相同,先来看看我们熟知的标准盒子模型: 从上 ...

  9. 让dwz 在td里显示图片

    让dwz 在td里显示图片 <!@{foreach from = $list item = element}@> <tr target="gid" rel=&qu ...

随机推荐

  1. VMware中centos虚拟机的安装

    几个月前,就下载了VMware,centOS 6 操作系统镜像.苦于对linux的不理解和安装教程的不熟悉,一直未安装成功. 几天前,终于独自安装好了,特此记录一下. 安装其实很简单,之前失败是在于安 ...

  2. vue中打包之后的dist文件不放在服务器的根目录下

    在工作当中,我使用webpack打包的dist,由于管理的问题,无法被放在服务器根目录下 ,但在目前的vue配置,dist不放在根目录下,访问页面会成为一片空白,于是便要对vue框架的config进行 ...

  3. [转帖]开始使用Chronograf

    地址:https://docs.influxdata.com/chronograf/v1.6/introduction/getting-started/ https://www.cnblogs.com ...

  4. LINK : fatal error LNK1104: cannot open file的解决方法

    结果是编译时通过了,但连接(F7)时却显示: LINK : fatal error LNK1104: cannot open file“Debug/1.exe” ============== 上一次运 ...

  5. 2019CSP-S游记

    \(2019CSP-S\)游记 \(Day : -26\) 初赛退役失败,准备复赛了... \(Day:0\) 早上\(7:30\)出发坐车去杭州,车上一直在听歌和睡觉中度过(话说锦零的歌真好听).. ...

  6. Go语言Mac、Linux、Windows 下交叉编译

    在很多时候,由于开发的方便,会有这样的场景出现,使用Mac开发或使用Windows开发,需要编译成Linux系统的执行文件,那么如何做到?Go语言提供了非常方便的命令行操作,即可实现. 1.Mac下编 ...

  7. 单档——PK单号新增、修改时不允许编辑,PK单号自动生成

    由系统自动生成单号(日期+流水),用户新增.修改时不允许编辑单号: 范例(cxmt631): 1)在#单头栏位开启设定#中,即 cxmt631_set_entry(p_cmd)下: #add-poin ...

  8. Windows authentication for WCF web services error

    WCF Web服务的Windows身份验证在部署到IIS时,默认网站添加应用程序的方式.浏览运行.svc文件报错. 错误代码: The authentication schemes configure ...

  9. 21-Perl 发送邮件

    1.Perl 发送邮件如果你的程序在 Linux/Unix 系统上运行,你就可以在 Perl 中使用 sendmail 工具来发送邮件.以下是一个简单的脚本实例用于发送邮件:#!/usr/bin/pe ...

  10. java字符串大小写转换

    String test="SHA34cccddee";    System.out.println(test.toUpperCase());//小写转大写 String test= ...