好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

css+div布局之CSS盒模型外边距合并问题_html/css_WEB-ITnose

问题表述:
那天晚上一个同学给我发来一个问题,原型大概是“一个maindiv嵌套了一个div.class="headr1" 的div 和一个div.class="header2" 的这样两个 div,他给maindiv 设定了background="black" header1设定background=“red” 。header2 设定background=“blue” 同时给heder1 设定margin-top:10px; 他预想的是内层 div.heder1 的上边距 maindiv 上边有10px的距离 但事实上 出现一个问题   ,内层div 并没有出现他所预想的那种效果,实际效果是 maindiv 仍然紧贴内层div 整个maindiv 上边框距离浏览器上边 增加了10px 的外边距” 
问题页面代码:

 1   2   3   4   5  无标题文档  6   7 *{ 8 margin:0; 9 padding:0;10 }11 #maindiv{12 13 width:800px;14 height:800px;15 background-color:#00FFFF;16  17 18 }19 .header1{20 width:600px;21 height:100px;22 margin-top:80px;23 background-color:#FF0000;24 overflow:hidden;25 26 }27 .header2{28 border: 1px solid #00FFFF;29 width:600px;30 height:100px;31 margin-top:20px;32 background-color:#666666;33 overflow:hidden;34 35 }36  37  38 39  40 

41

42 新华网马尼拉4月23日电(记者赵洁民)中国驻菲律宾大使馆发言人张华23日对媒体说,43 中国并非如某些人所说的那样,正使中菲在南海黄岩岛的紧张局势升级,而是正使那里的局势降级。44 张华说,中国在黄岩岛海域的渔政310船和海监船084号22日已离开黄岩岛海域。目前,45 只有一艘海监船仍在黄岩岛海域执法。他指出:“中国撤出两艘舰船再一次证明,中国并非如某些人说的那样,46 正使黄岩岛的紧张局势升级,而是使那里的局势降级。”47 这位发言人的谈话是针对菲律宾一些媒体关于“中国正在使黄岩岛局势升级”的误导。48 张华强调,中国愿意通过外交手段友好解决这一事件。49

查看更多关于css+div布局之CSS盒模型外边距合并问题_html/css_WEB-ITnose的详细内容...

  阅读:37次