There is a gap above the top of the image. What is causing it? I want the image to appear from the very top of the page. The image covers takes up half the width of the webpage.
HTML (在这里我添加了一个导航栏，并且有一个包含图像的div 标签。
<nav class="navbar">
<ul>
<li><a href ="#home"><div class ="line-effect">Home</div></a></li>
<li><a href ="#about"><div class="line-effect">About</div></a></li>
<li><a href ="#portfolio"><div class="line-effect">Portfolio</div></a></li>
</ul>
</nav>
<div class="bg-image">
<img src="newvec.png" height="800px" width="750px">
</div>
CSS(这是导航栏的样式。没有应用于图像的样式。"box：ssize：border-box"属性已应用于整个文档。
.navbar{
padding:5px;
display: flex;
justify-content: flex-end;
align-items: center;
position:fixed;
padding:50px 10px;
width:100%;
height:8vh;
}
.navbar ul{
display: flex;
list-style: none;
padding: 20px 40px;
}
.navbar ul li a{
font-family: Nunito;
color:black;
text-decoration: none;
font-size: 20px;
display: block;
padding: 5px 25px;
}
你检查过你的<body>标签吗？ 如果您没有使用reset.css则<body>标记中都有标准margin。
只需尝试添加
body {
margin : 0;
}
在您的 CSS 标记上。