html - 如何减少hr标签的默认边距？

Question

我可以增加 hr 标签的默认边距。但是我不能将 hr 的边距减少到零。我所需要的只是顶部和底部边距为零的水平线

<p>This is header</p>
<hr class="divider" />
<p>This is content. I just want to reduce the margin of hr tag</p>

hr.divider
{ 
   margin-top: 0em;
   margin-bottom: 0em;
   border-width: 2px;
} 

另见 this jsfiddle .

Answer 1

您已经成功了。 hr 没有顶部或底部边距。 p 元素显示了 padding 和/或 margin。在这里您可以看到实际效果:

 hr.divider { 
  margin: 0em;
  border-width: 2px;
} 

p {
  margin: 0;
  padding: 0; 
}

<p>This is header</p>
<hr class="divider" />
<p>This is content. I just want to reduce the margin of hr tag to zero</p>