.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. day38 各种队列、Event事件、协程、猴子补丁

    1.各种队列 我们已经学习了队列这种存取值的方法,我们以前使用的队列是可以进行进程间通信的(IPC),但是今天学习的这两种队列是不能进行进程间通信的,只能进行线程间的通信 这两种队列分别是先进后出式队 ...

  2. readline安装

    wget -c ftp://ftp.gnu.org/gnu/readline/readline-6.2.tar.gz tar -zxvf readline-6.2.tar.gz cd readline ...

  3. 2019/5/13 洛谷P4742 【tarjan缩点 + 拓扑dp】

    题目链接:https://www.luogu.org/problemnew/show/P4742 题目大意:给一张有向图, 每个点都有点权,第一次经过该点时,该点的点权有贡献,求这张图上一条路径(终点 ...

  4. [转帖]intel发布会之前,漫谈CPU核心架构:CCX、Ring Bus、Mesh

    intel发布会之前,漫谈CPU核心架构:CCX.Ring Bus.Mesh https://baijiahao.baidu.com/s?id=1607585351741429318&wfr= ...

  5. SQL SERVER DATEADD函数

    定义: DATEADD() 函数在日期中加上指定的时间间隔. ※指定的时间间隔可以为负数 语法: DATEADD(datepart,number,date) 参数: ①datepart 参数可以是下列 ...

  6. Spring注解Component原理源码解析

    在实际开发中,我们经常使用Spring的@Component.@Service.@Repository以及 @Controller等注解来实现bean托管给Spring容器管理.Spring是怎么样实 ...

  7. PAT B1022 D进制的A+B

    课本AC代码 #include <cstdio> int main() { int a, b, d; scanf("%d%d%d", &a, &b, & ...

  8. tp5 post接到的json被转义 问题解决

    今天做项目的时候前端需要可以保存可变数据, 然后原样返回给前端 接口 $data =input('post.');//用户唯一标识$goods = $data['goods']; $shopcuxia ...

  9. drf-更新四大接口-单改整体-单改局部-群改整体-群改局部-04

    目录 复习 基于前一天序列化基础 整体单改 单与整体局部修改 复习 """ 1.ModelSerializer序列化类 models.py class BaseModel ...

  10. JS中的继承(上)

    JS中的继承(上) 学过java或者c#之类语言的同学,应该会对js的继承感到很困惑--不要问我怎么知道的,js的继承主要是基于原型(prototype)的,对js的原型感兴趣的同学,可以了解一下我之 ...