Question

我开始为我的网页设计课做一个页面，但我遇到了一个问题。到目前为止，我的页面有一个导航栏和一张图片。我想用css为中心。

display: block;
margin-left: auto;
margin-right: auto

我将这个用于我的导航栏和我的img。我希望导航栏始终位于图像上方，即使页面调整大小。无论如何在css中这样做？

Answer 1

如果元素具有宽度，则边距将居中。所以你的CSS可能看起来像：

img{
    width:300px;
    margin: 0 auto;
}

nav{
    width:600px;
    margin: 0 auto;
}

基本的html：

<nav>
    <ul>
        <li>Something</li>
        <li>Something else</li>
    </ul>
</nav>
<img src="../path-to-file.jpg" alt="image">

这将把两个元素都集中在一起。

至于导航总是在图像上方...你的意思是重叠吗？或者只是“高于”它的问题超出了这个答案？

如果你说清楚，我可以更新这篇文章。

Answer 2

要回答“我希望导航栏始终位于图像上方，即使页面调整大小。无论如何都要在css中执行此操作？”

如果您希望导航栏坚持使用position: absolute