Question

我想删除标题和表之间的空白，但是我不知道如何。我已经在屏幕截图上标出了位置。

ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #333;
  position: -webkit-sticky;
  /* Safari */
  position: sticky;
  top: 0;
}

<h1>SPLETNA STRAN</h1>
<ul>
  <li><a href="stran1.html"> STRAN 1</a></li>
  <li><a href="stran2.html"> STRAN 2</a></li>
  <li><a href="stran3.html"> STRAN 3</a></li>
  <li><a href="stran4.html"> STRAN 4</a></li>
  <li><a href="stran5.html"> STRAN 5</a></li>
</ul>

Answer 1

我只能给你一个猜测。

h1, ul {
    margin: 0;
}

可以解决问题。

Answer 2

只需添加例如margin-top:-20px;

ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden; 
  background-color: #333;
  position: -webkit-sticky; /* Safari */
  position: sticky;
  top: 0;
  margin-top:-20px;
}

<!DOCTYPE html>
<html>
<head>

    <title>Spletna stran</title>
    <link rel="stylesheet" type="text/css" href="style.css">


</head>
<body>

<h1>SPLETNA STRAN</h1>

<ul>
<li><a href="stran1.html"> STRAN 1</a></li>
<li><a href="stran2.html"> STRAN 2</a></li>
<li><a href="stran3.html"> STRAN 3</a></li>
<li><a href="stran4.html"> STRAN 4</a></li>
<li><a href="stran5.html"> STRAN 5</a></li>
</ul> 
</body>
</html>

Answer 3

行高是常见的罪魁祸首：属性。尝试设置B。如果您还没有CSS重置表，也可以考虑将它重置为零，以将浏览器的预设样式归零。这就是我正在使用的https://meyerweb.com/eric/tools/css/reset/

Answer 4

这可能是因为用户代理样式表添加了reset.css以覆盖它们，如果您只想修改链接的style.css，只需将其更新/添加到代码中。

ul {
margin-top:0; }
h1 {
margin-botton:0; }

如何减少html中元素之间的间距？

4 个答案: