如何删除css中<li>之间的边距？

Question

我开始学习HTML和CSS，并想知道是否有办法删除或减少这两个列表项之间的margin？

参见片段＆amp;图片如下：

＆＃13;

＆＃13;

#main {
  color: black;
  width: 350px;
  float: right;
}

＆＃13;

<div id="main">
  <h1>HOME PAGE</h1>
  <ol>
    <li>
      <h4><a href="https://www.youtube.com/watch?v=KJ13lX20FqU" target="_blank">basic html with basic tags</a></h4>
      <ul>
        <li>
          <h5><a href="http://www.w3schools.com/TAgs/tag_li.asp" target="_blank">basic tags colleciton</a></h5>
        </li>
      </ul>
    </li>
  </ol>
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 1

  

<h1>，<h2>，<h3>至<h6>之类的所有标题元素都有一些   所有浏览器的默认保证金（可能因浏览器而异）。

您需要根据需要删除或重置此保证金。

#main h4,
#main h5 {margin: 0;}

#main{
  color: black;
  width: 350px;
  float: right;
}

#main h4,
#main h5 {margin: 0;}

<div id="main">
  <h1>HOME PAGE</h1>
  <ol>
    <li>
      <h4><a href="https://www.youtube.com/watch?v=KJ13lX20FqU" target="_blank">basic html with basic tags</a></h4>
      <ul>
        <li>
          <h5><a href="http://www.w3schools.com/TAgs/tag_li.asp" target="_blank">basic tags colleciton</a></h5>
        </li>
      </ul>
    </li>
  </ol>   
</div>

Answer 2

在您的示例中，边距来自标题，尝试;

#main{
    color: black;
    width: 350px;
    float: right;
}
h4, h5{
	margin: 0;
}

<div id="main">
	<h1>HOME PAGE</h1>
	<ol>
		<li>
		<h4><a href="https://www.youtube.com/watch?v=KJ13lX20FqU" target="_blank">basic html with basic tags</a></h4>
			<ul>
				<li>
					<h5><a href="http://www.w3schools.com/TAgs/tag_li.asp" target="_blank">basic tags colleciton</a></h5>
				</li>
			</ul>
		</li>
	</ol>   
</div>

Answer 3

您可以尝试这样：

＆＃13;

＆＃13;

#main{
  color: black;
  width: 350px;
  float: right;
}

li h4, h5 {
  margin: 0;
}

＆＃13;

<div id="main">
  <h1>HOME PAGE</h1>
  <ol>
    <li>
      <h4><a href="https://www.youtube.com/watch?v=KJ13lX20FqU" target="_blank">basic html with basic tags</a></h4>
      <ul>
        <li>
          <h5><a href="http://www.w3schools.com/TAgs/tag_li.asp" target="_blank">basic tags colleciton</a></h5>
        </li>
      </ul>
    </li>
  </ol>	
</div>

    

＆＃13;

＆＃13;

＆＃13;