亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

父元素設置高度,子元素設置margin-bottom為何無效

父元素設置高度,子元素設置margin-bottom為何無效

南寧吳彥祖 2016-12-19 18:01:33
<!doctype html><html> <head> <meta charset="UTF-8"> <title>margin傳遞</title> <style type="text/css"> body { margin: 0; } .d1 { background-color: #6183F3; height: 100px; } .da { background-color: #D60003; height: 200px; } .db { width: 200px; height: 200px; background-color: #FF8D8F; margin: 10px; } .dc { height: 100px; background-color: #6E0001; } </style> </head> <body> <div class="d1"></div> <div class="da"> <div class="db"></div> </div> <div class="dc"></div> </body></html>da的子元素dd設置外邊距之后左右邊距和上邊距都出現了外邊距,但是為何margin-bottom不把dc(深紅色)往下移10px,知道解決辦法,但是就是想請問大神們為何會造成這個現象?非常感謝
查看完整描述

3 回答

?
echo_kinchao

TA貢獻600條經驗 獲得超86個贊

是不是觸發了上下級文本呢

查看完整回答
反對 回復 2016-12-20
?
寶慕林6972327

TA貢獻2條經驗 獲得超0個贊

因為db是da的子節點,對子節點margin-top或者margin-bottom會作用到父級上,這就是所謂的margin重疊。

查看完整回答
反對 回復 2016-12-20
  • 南寧吳彥祖
    南寧吳彥祖
    既然子元素會作用于父元素上,為何父元素margin-top有10px的空白,而da(紅色)和dc(深紅色)之間沒有呢?
?
Siming0

TA貢獻16條經驗 獲得超32個贊

父級你設定了高度了,就會到子集的樣式給包裹在高度以內了,你沒有設置寬度所以設置外邊距之后左右邊距和上邊距都出現了外邊距

查看完整回答
反對 回復 2016-12-19
  • 南寧吳彥祖
    南寧吳彥祖
    既然父元素會到子集的樣式給包裹在高度以內,那為何da上出現10px間距,下面不出現呢?
  • Siming0
    Siming0
    你用開發者工具看看是有的,只是父級包裹層的高度太低了就看不見了
  • 南寧吳彥祖
    南寧吳彥祖
    謝謝你的回答,問題已解決
  • 3 回答
  • 0 關注
  • 6397 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號