【问题标题】:Logo above navigation bar导航栏上方的徽标
【发布时间】:2016-03-17 00:18:30
【问题描述】:

我是第一次做网站,我应该怎么做才能让我的网站徽标出现在导航栏上方?如果有人可以纠正我的代码并告诉我我做错了什么。

www.codepen.io/anon/pen/VaPKaK

【问题讨论】:

标签: html css


【解决方案1】:

您的图片标签中的“家”和样式之间缺少一个空格

您的问题有点令人困惑,您希望您的徽标图像字面上显示在您的导航上方吗?如果是这样,请不要将图像标签放在列表标签​​中

所以而不是:

<li id="home"><a class="active" href="#home"><img src="home.png" alt="Home"style="width:20px;height:20px;"></a></li>
  <li id="news"><a href="#news">Blog</a></li>

试试

<a class="active" href="#home"><img src="home.png" alt="Home" style="width:20px;height:20px;"></a>
  <li id="news"><a href="#news">Blog</a></li>

另外,尽量不要在 html 中添加样式。把它们放在你的 CSS 中。它使阅读更容易。

这是编辑后的Codepen 以及所有这些编辑,徽标位于导航上方。 希望有帮助!!

【讨论】:

  • "现在没有徽标。我想把它放在导航栏上方类似这样的东西。例如:thinkfarmer.com/imagethumb/197871900000/9231/0x0/False/... 我只是不知道如何“home.png 只是一个主页按钮。
  • 我已经用我为你编辑的 codepen 的链接编辑了我的答案。这就是你要找的东西吗?
  • 谢谢你!还有一件事我怎样才能只在导航栏上方改变颜色?
  • aa 而且它不起作用,它像这样显示puu.sh/nJgch/6ebd7728f1.jpg 我认为它需要成为导航栏的一部分,因为我的导航栏在向下滚动页面时始终位于顶部
  • 好的,所以我再次编辑了link,以展示如何使用 css 操作所有内容,以便在滚动时保持固定而不是固定(在本例中为

    )我包装了所有内容从您的徽标到 div 中导航的末尾,并将其位置设置为固定。然后我在其上方添加了一个带有边距的 H1,以向您展示滚动时它是如何工作的。这有帮助吗?

猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2018-07-27
  • 1970-01-01
  • 1970-01-01
  • 2018-03-17
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多