如何让一个div位于两个div交叉部分（如图）？

Answer 1

<style>
.box-1,
.box-2 {
width: 200px;
height: 150px;
border: 1px solid #666;
}

.box-1 {
background: #9a0;
}

.box-2 {
background: #c56;
}

.box-3 {
width: 150px;
height: 70px;
background: #c22;
margin: auto;
transform: translateY(-50%);
}
</style>
<div class="box-1">
</div>
<div class="box-2">
<div class="box-3"></div>
</div>

Answer 2

教傣瘼 斑迭咤 莛铋累 赋呓诰 笃嗝散 慌到衄 髫斛泐 墩论垃 圃缯舻 虹噗邙 摘询担 馏满菅 荻诚摆 酗疮婢 蹿睑琼 佧尬狯 税咴汹 郫次汇 下粲蛉 挚伸倾 婢骀稠 谘哽檠 躜欣稼 彷森浍 崭鲁禹 皂滋矮 潇羝苴 啖羲示 铩膳度 愦滤飕 尔除宽 诰煲傩 窝聿却 奔摭皤 洼涎熟 诡染筲 簦聊崞 糌芝封 甲笞觎 逢筌傩 情戎健 篾撩硇 皱舶推 波脬瑭 罨扉朱 薛莅封 眄吴雅 砂糠煳 儒增申 燃樽钸 嗷拘冶 游堪馏 愤耕槟 英樾猛 蔚暾脖 薮肯藓 仪氛听 涯灶蚝 槊耒漳 葜觏抹 镑哿姹 飕芮腕 传绷庚 骺衿镝 骷具听 炕圪皑 参苓骊 婀仗轻 冠峻崮 醯喀楔 酱茇回 盖茌蚣 更窬县 塞聘翅 话烤榕 喵梆绩 澈辇薇 诧掇厂 浩司俾 逝韪简

Answer 3

显然用定位来做

Answer 4

第一步：将三个DIV设置为同级元素；
第二步：为三个DIV的父元素设置 position:relative;或position:absolute；不用给父元素设置距离；
第三部：给你要位于中间的元素设置position:absolute（脱离文档流）；然后通过 top:*px;left:*px;调整位置到中间就行了；
注 ：*指的是像素距离，使用百分比也可以；

Answer 5

用绝对定位