标签:color 折叠 元素 100px height 外边 box1
相邻的垂直方向外边距会发生重叠
兄弟元素之间相邻的垂直方向谁大听谁的,一正一负去两者和,如果是两个负数,去绝对值大的
父子元素
父子元素之间的相邻外边距,子元素会传递给父元素。(上外边距)
父子外边距一个折叠,会影响页面的布局
解决方案:使用padding隔开,不是很完美的方式
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .box1 { width: 200px; height: 199px; font-size: 100px; } .box1 { background-color: chocolate; border-top: 1px red solid; } .box3 { width: 100px; height: 99px; background-color: crimson; margin-top: 100px; } </style> </head> <body> <div class="box1"> <div class="box3"> </div> </div> </body> </html>
标签:color,折叠,元素,100px,height,外边,box1 来源: https://www.cnblogs.com/strugglingbo/p/14408472.html
本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享; 2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关; 3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关; 4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除; 5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。