如何讓一個(gè)div位于兩個(gè)div交叉部分（如圖）？
慕粉1555408013
2017-04-14 17:27:57
4 回答
已采納
BalanceGo
TA貢獻(xiàn)1條經(jīng)驗(yàn) 獲得超0個(gè)贊
<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>-
慕粉1555408013謝謝！
慕的地6079101
TA貢獻(xiàn)3593條經(jīng)驗(yàn) 獲得超0個(gè)贊
教傣瘼
斑迭咤
莛鉍累
賦囈誥
篤嗝散
慌到衄
髫斛泐
墩論垃
圃繒艫
虹噗邙
摘詢擔(dān)
餾滿菅
荻誠擺
酗瘡婢
躥瞼瓊
佧尬獪
稅咴洶
郫次匯
下粲蛉
摯伸傾
婢駘稠
諮哽檠
躦欣稼
彷森澮
嶄魯禹
皂滋矮
瀟羝苴
啖羲示
鎩膳度
憒濾颼
爾除寬
誥煲儺
窩聿卻
奔摭皤
洼涎熟
詭染筲
簦聊崞
糌芝封
甲笞覦
逢筌儺
情戎健
篾撩硇
皺舶推
波脬瑭
罨扉朱
薛蒞封
眄吳雅
砂糠煳
儒增申
燃樽鈽
嗷拘冶
游堪餾
憤耕檳
英樾猛
蔚暾脖
藪肯蘚
儀氛聽
涯灶蠔
槊耒漳
葜覯抹
鎊哿姹
颼芮腕
傳繃庚
骺衿鏑
骷具聽
炕圪皚
參苓驪
婀仗輕
冠峻崮
醯喀楔
醬茇回
蓋茌蚣
更窬縣
塞聘翅
話烤榕
喵梆績(jī)
澈輦薇
詫掇廠
浩司俾
逝韙簡(jiǎn)
譚勝
TA貢獻(xiàn)1條經(jīng)驗(yàn) 獲得超0個(gè)贊
第一步：將三個(gè)DIV設(shè)置為同級(jí)元素；
第二步：為三個(gè)DIV的父元素設(shè)置 position:relative;或position:absolute；不用給父元素設(shè)置距離；
第三部：給你要位于中間的元素設(shè)置position:absolute（脫離文檔流）；然后通過 top:*px;left:*px;調(diào)整位置到中間就行了；
注 ：*指的是像素距離，使用百分比也可以；
-
慕粉1555408013謝謝你的回答我試試！
添加回答
舉報(bào)
0/150
提交
取消