我有这个HTML结构:
<body cz-shortcut-listen="true">
<div id="panels">
<section id="sect0" name="lvl0">
<div id="divLvel0" class="level zero">
<h2>top<nav><ul><li><a href="#sect1">Languages</a></li><li><a href="#sect2">Proficiency</a></li><li><a href="#sect3">Milestones</a></li><li><a href="#sect4">Details</a></li></ul></nav></h2>
</div>
</section>
<section id="sect1" name="lvl1">
<div id="divLvel1" class="level one">
<div id="panel_lvl1">
<h2>Languages</h2>
</div>
</div>
</section>
<section id="sect2" name="lvl2">
</section>
<section id="sect3" name="lvl3">
<div id="divLvel3" class="level three">
<div id="panel_lvl3">
<h2>Milestones</h2>
<div id="chart3">
</div>
</div>
</div>
</section>
<section id="sect4" name="lvl4">
<div id="divLvel4" class="level four">
<div id="panel_lvl4">
<h2>Details</h2>
<div id="chart4">
</div>
</div>
</div>
</section>
</div>
</body>
https://jsfiddle.net/thadeuszlay/Lkdo5xv3/2/
每个部分直接相互接触,即部分之间没有其他元素.但不知何故,你可以看到每个部分之间的间隙(绿色背景颜色).
我已经将填充和身体边缘设置为零.我也用DIV替换了这些部分.但差距仍然存在.
如何摆脱差距,使每个部分接触到其他部分而没有间隙？
小智 5
在样式开始时重置所有对象的填充和边距
* {
margin:0;
padding:0;
}
之后,您可以根据需要为每个对象设置填充和边距