html – 为什么顶部div的margin-top将适用于“？_html-js-css

概述在这里我发贴了一个演示 http://jsfiddle.net/LxYMv/1/. 正如你可以看到< body>获得margin-top：从顶部div为10px,因此< html>的黑色背景泄漏出来.这是不是意味着我不能给顶端的积分？ <?xml version="1.0" encoding="UTF-8"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1. 在这里我发贴了一个演示 http://jsfiddle.net/LxYMv/1/.

正如你可以看到< body>获得margin-top：从顶部div为10px,因此< HTML>的黑色背景泄漏出来.这是不是意味着我不能给顶端的积分？

<?xml version="1.0" enCoding="UTF-8"?><!DOCTYPE HTML PUBliC "-//W3C//DTD xhtml 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><HTML xmlns="http://www.w3.org/1999/xhtml">    <head>        <style>            HTML{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fIEldset,legend,input,button,textarea,select,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fIEldset,img{border:0}address,caption,cite,dfn,em,optgroup,option,strong,var{Font:inherit}del,ins{text-decoration:none}li{List-style:none}caption,th{text-align:left}h1,h6{Font-size:100%;Font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;Font-variant:normal}sup{vertical-align:baseline}sub{vertical-align:baseline}legend{color:#000}            HTML{background:black}            body{background:white}        </style>    </head>    <body>        <div >Here the top div begins</div>        <div >A long long div</div>    </body></HTML>

解决方法这叫做 margin collapsing.

当具有边距的元素在没有填充或边框的元素内时,边距将应用于父元素之外,而不是在子元素和父边缘之间.

这种行为的基本原因是边距指定元素之间的最小差异,而不是元素周围的距离,如padding指定元素内容周围的距离.

总结

以上是内存溢出为你收集整理的html – 为什么顶部div的margin-top将适用于“？全部内容，希望文章能够帮你解决html – 为什么顶部div的margin-top将适用于“？所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。

欢迎分享，转载请注明来源：内存溢出

原文地址:https://54852.com/web/1102920.html