我有一个简单的 html 页面，其中有一些样式，我不明白为什么要添加一些上边距？
这是来源：
<!doctype html>
<html>
<head>
<title></title>
<style type="text/css">
body {
margin: 0;
padding: 0;
background-color: #ffffcc;
}
#content {
width: 900px;
margin-left: auto;
margin-right: auto;
border: 0;
background-color: #ccccff;
}
</style>
</head>
<body>
<div id="content">
<div>
<ul>
<li><a href="./xxx.html">xxx</a>
</li>
<li><a href="./yyy.html">yyy</a>
</li>
<li><a href="./zzzz.html">zzz</a>
</li>
</ul>
</div>
</div>
</body>
</html>
这是“烦人”的空间。
如果我添加“margin-top : 0;”空间消失了……但我不高兴，直到我明白为什么。
边距上<ul>来自浏览器添加到元素的默认样式。例如，如果您打开 Chrome 的 DevTools 并检查<ul>元素你会看到这样的样式。这用户代理样式表指浏览器默认样式。1em保证金变为16px因为浏览器有一个font-size: 16px默认情况下。
由于浏览器之间的默认样式不同，常见的技术是使用重置样式表，例如Eric Meyer 的重置 CSS http://meyerweb.com/eric/tools/css/reset/ or Nicolas Gallagher 的 normalize.css http://necolas.github.io/normalize.css/，以减少这些浏览器不一致的情况。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
