Question

我在页面顶部放了一个图像，但我也想在页面顶部插入一个导航栏（在图像前面）。但实际导航栏位于图像上方，我不能将它们放在同一行上，我可以将导航栏固定在顶部，但是当我向下滚动时它真的很烦人。有什么方法可以解决我的问题吗？

（PS：图片不是背景！）

<nav class="navbar " role="navigation">
<div class="container-fluid">
    <div class="collapse navbar-collapse navbar-right navbar-main-collapse">
        <ul class="nav navbar-nav">
            <li>
                <a> Link </a>
            </li>
            <li>
                <a> Link </a>
            </li>
            <li>
                <a> Link </a>
            </li>
            <li>
                <a> Link </a>
            </li>
            <li>
                <a> Link </a>
            </li>
        </ul>
    </div>
</div>
</nav>
<img src=" ">

Answer 1

这应该有效：

.navbar {
  position: absolute;
  top: 0;
  left: 0;
}

请参阅：https://jsfiddle.net/tcybj6sj/

您基本上有正确的想法：将导航栏固定到页面顶部。但是，使用position: fixed而不是使用position: absolute将导航栏固定到浏览器窗口中的固定位置，而不是$myFieldset.serialize()将导航栏固定到页面内的固定位置。

图像前面的未固定导航栏

1 个答案: