外邊距失效bug
阿新 • • 發佈:2019-01-06
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> #per{ height: 200px; width: 200px; background-color: #ea2000; overflow: hidden; /*在子盒子中新增外邊距會失效 直接影響父盒子的外邊距 這時新增這個屬性 就可以解決解決方式 1、為父盒子新增 overflow:hidden 2、為父盒子新增padding 3、為父盒子新增border*/ } #child{ height: 100px; width: 100px; background: blue; margin: 0 auto; margin-top: 50px; } </style> <title></title> </head> <body> <div id="per"> <div id="child"></div> </div> </body> </html>