横幅和页面顶部之间有空白区域

Question

在透明横幅和页面顶部之间有这个空间。所有边距和填充选项都设置为 0。我不知道我做错了什么，有什么想法吗？

图片：https://imgur.com/a/XQMsOVT

主体：

<video autoplay muted loop id="myVideo">
  <source src="sparkle.mp4" type="video/mp4">
  Your browser does not support HTML5 video.
</video>



        <div class="hero-image" >
            <h1 align="center" style="color:white; font-size:50px; font-family:Sofia;">Sparkle</h1>
        </div>

        <div id="ok">
            <H1 style="padding:0; margin:0; overflow:hidden;" align="center"> </h1>
        </div >
    <p style="position:relative;"> okok <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>  <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> okoks </p>

css:

body, html {
  margin: 0px 0px 0px 0px ;
  padding:0px 0px 0px 0px ;
  font-family: Arial, Helvetica, sans-serif;


  background-repeat:no-repeat;
  background-size:cover;
}

#myVideo {
  position: absolute;
  right: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
  z-index:-10
}



.hero-image {
  overflow:scroll
  margin:0;
  top:0;
  width: 100vw;
  position: sticky;
  background-color: rgba(0, 0, 0, 0.3);
}

Answer 1

"overflow:scroll" 后面缺少一个逗号，这会影响 CSS 的下一行

.hero-image {
  overflow:scroll; // semi-colon added
  margin:0;
  top:0;
  width: 100vw;
  position: sticky;
  background-color: rgba(0, 0, 0, 0.3);
}