0

我刚刚开始学习 HTML 和 CSS，并创建了一个简单的顶部导航栏，在我添加定时 flexslider 之前它一直固定在页面顶部。添加滑块后，导航栏不再固定在视口的顶部，即使我没有更改导航栏 CSS。提前感谢您的任何想法！

我的 HTML 是：

 <div class="top-bar">

   <section class="logo">
      <ul>
        <li><a href="#"><img src="img/logo.jpg" id="logo"></a></li>
      </ul>
    </section>   

    <section class="nav-bar">
      <ul>
        <li><a href="#">Link 1</a></li>
        <li><a href="#">Link 2</a></li>
        <li><a href="#">Link 3</a></li>
        <li><a href="#">Link 4</a></li>
      </ul>
    </section>

我的CSS是：

.top-bar {
    width: 100%;
    height: 7.5%;
    top: 0;
    opacity: 0.8;
    position: fixed;
    z-index: 10;
    display: inline-block;
}


#logo {
    width: 2.0vw;
    z-index:20;
}

.nav-bar {
    position: fixed;
    right: 27.5%;
    z-index: 15;
}

再次感谢任何帮助！

4

0 回答 0