我正在 Django 中构建一个应用程序,并且为了编写模板,我使用 HTML/CSS,现在我在页面的顶部和左侧遇到一些奇怪的空白,无论我如何尝试,它都不会出现,如图所示下面
现在这是我的 css 文件
base.css
.navbar {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 60px;
display: flex;
align-items: center;
justify-content: space-between;
background-color: #333;
color: white;
padding: 10px 20px;
z-index: -1;
}
.navbar-brand img {
max-height: 40px;
}
.navbar-menu ul {
list-style-type: none;
margin: 0;
padding: 0;
display: flex;
}
.navbar-menu li {
margin: 0 10px;
}
.navbar-menu li a {
color: white;
text-decoration: none;
}
.navbar-user img {
max-height: 30px;
}
和 home.css
.home-video {
position: relative;
width: 100vw;
height: 100vh;
overflow: hidden;
z-index: -1;
}
#bg-video {
width: 100vw;
height: 100vh;
object-fit: cover;
}
.home-content {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center;
}
.home-content h1 {
font-size: 3rem;
margin-bottom: 20px;
color: white;
}
.home-content p {
font-size: 1.2rem;
margin-bottom: 30px;
color: white;
}
.btn {
display: inline-block;
padding: 10px 20px;
background-color: #333;
color: white;
text-decoration: none;
border-radius: 5px;
transition: background-color 0.3s ease;
}
.btn:hover {
background-color: #555;
}
我几乎尝试了所有事情,但找不到我做错的地方,请帮助我。谢谢。
使用下面的代码。
body{
margin : 0px !important;
}