html - 在导航栏中定位 Logo 时出现问题

Question

我正在制作一个网站，但在定位导航栏中的 Logo 时遇到了问题。

我在 http://www.fearless-music.net/test 创建了网站的测试版本

Logo 未出现在其空间的中心。在较小的浏览器窗口中，它隐藏在导航栏的“主页”区域后面。

此外，对于我可以对导航栏进行的代码改进有什么建议吗？

再次感谢!

Answer 1

如果您缩进代码，则更容易看出发生了什么。尝试将图像添加到它自己的 div 中并将其包含在 p 标签中，然后您将能够使用适当的 css 规则将其居中。使用 css 设置 div 时的提示添加颜色边框或背景，您稍后可以将其删除以帮助调整大小和定位。

   <div class="header">
       <div class="logo">
          <p><img src="images/logo.png" alt="fearless music" /></p>
       </div>

            <ul class="nav">
                <li class"currentpage"><a href="index.html">Home</a></li>
                <li><a href="#">Link1</a></li>
                <li><a href="#">Link2</a></li>
                <li><a href="#">Link3</a></li>
                <li><a href="#">Link4</a></li>
                <li><a href="#">Special Link</a></li>
            </ul>

    </div>