我的导航栏无法使用背景视频,我该如何修复它?

问题描述 投票:0回答:1

一旦我放入背景视频,我就无法再按导航栏了,有什么问题吗?我也尝试过任何类型的 z-index 但它不起作用。 我尝试删除视频,然后它起作用了,但我不明白为什么它不能在后台处理视频。 如果您能帮助我解决其他一些问题,那就太好了:)

<!DOCTYPE html>
<html lang="de">
    <head>  
        <meta charset="utf-8">
        <title>fashion</title>
        <link rel="stylesheet" type="text/css" href="style_2_Seite.css" media="all" />
        
    </head>
    
    <body>
        <div class="header">
            <a href= "1-Seite.html" class= logo>fashion</a>
            <nav class="navbar">
                <a href="1-Seite.html">Home</a>
                <a href="2-Seite.html">Shop</a>
                <a href="#">Über uns</a>
            </nav>
        </div>
        
        
            <video autoplay muted loop src="VideoErsteSeite.mp4"> </video>
        
    
    </body>

                    
                    
</html>
body {
   
    background-color: #fff;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

}


.header{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding:19px 20px;
    background: #DCdCdC
    z-index: 1001;
}



    
.logo {
    position: fixed;
    top: -10px;
    font-size: 32px;
    padding:20px 20px;
    color: #fff;
    text-decoration: none;
    font-weight: 650;
    
}

.navbar a {

    font-size: 18px;
    color: #fff; 
    font-weight: 600; 
    text-decoration: none; 
    margin-left: 400px;
    word-spacing: 2px;
    z-index: 1001;
}
html css video navbar z-index
1个回答
0
投票

在 CSS

.header
background
末尾缺少分号。

这导致 CSS 忽略

z-index
属性。

background: #DCdCdC
z-index: 1001;

应该是

background: #DCdCdC;
z-index: 1001;

我很惊讶你的编辑没有注意到这一点并给你一条红色的波浪线。

© www.soinside.com 2019 - 2024. All rights reserved.