如何将此Div图像设置为全屏，以使其隐藏蓝色背景颜色

Question

我制作了一个DIV并设置了其背景图像，但背景图像没有覆盖全屏，周围有一些空间。蓝色是身体颜色。

请参考图像在这里

我非常初学者Web开发的初学者，请原谅我的愚蠢错误

#one{
    background:linear-gradient(0deg, rgba(0, 0, 0, 0.7) 10% , rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0.7) 75%), url("https://picsum.photos/500");
    padding-top: 168px;
    padding-bottom: 100px;
    color: white;
    border: none;
    background-size: cover;
}

<div id="one">
        <center>
        <p id="p1">Unlimited movies, TV <br>shows and more.</p>
        <p id="p2">Watch anywhere. Cancel anytime.</p>
        <p id="p3">Ready to watch? Enter your email to create or restart your membership.</p>
         
         <input id="mail" type="text" >
         <input id="mailb" type="submit" value="Get Started">
        </center>
    </div>

Answer 1

将此线添加到您的CSS

body {
    margin: 0;
}

这是因为，浏览器添加一点边距。

因此，您只需要手动将其重置为0

body {
  margin: 0;
}

#one {
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.7) 10%, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0.7) 75%), url("https://picsum.photos/500");
  padding-top: 168px;
  padding-bottom: 100px;
  color: white;
  border: none;
  background-size: cover;
}

<div id="one">
  <center>
    <p id="p1">Unlimited movies, TV <br>shows and more.</p>
    <p id="p2">Watch anywhere. Cancel anytime.</p>
    <p id="p3">Ready to watch? Enter your email to create or restart your membership.</p>

    <input id="mail" type="text">
    <input id="mailb" type="submit" value="Get Started">
  </center>
</div>

Answer 2

默认情况下，身体有一定余地。因此，您可以通过将保证金和填充为0来删除。

body {
    padding: 0;
    margin: 0;
}

还要将背景图像保持在中间，请在您的#One样式中添加这两行代码。

background-position: center;
background-repeat: no-repeat;

希望我的答案对您有帮助。