导航栏上方的标志答案

【问题标题】：Logo above the navigation bar导航栏上方的标志
【发布时间】：2016-10-10 02:30:48
【问题描述】：

好的，伙计们，因为第一个回答没有用，我添加了整个代码。对不起，这是我在这个网站上的第一个问题，所以不要因为我的错误而生气。

css:

<!DOCTYPE html>
<html>
<head>

<style>

html {
    height: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background: #70bg32;
    background-repeat:no-repeat;
    background: -webkit-linear-gradient( #fff, #7cceff);
    background: -moz-linear-gradient( #fff, #7cceff);
    background: -ms-linear-gradient( #fff, #7cceff);
    background: -o-linear-gradient( #fff, #7cceff);
    background: linear-gradient( #fff, #7cceff);
}

ul {
position: fixed;
   list-style-type: none;
    margin: 0;
    padding: 0;

    overflow: hidden;
background-color: #31a7ff;
top:0;
width: 100%;
border: 1px solid #0060a7;
}

li {
float: left;

}

li a {

    display: block;
color:white;
text-align:center;
    padding: 14px 16px;
text-decoration:none;

}


li a:hover {
    background-color: #15649f;
}


.active {
    background-color: #004376;
}

.headerLogo {
float:left;
margin:auto;
display:inline-block;
background:black;
padding:5px;
width:100%;
color:white;
}
.logo
{
width:32px;
height:32px;
}

html:

</head>
<body>

<img class="logo"
     src="amundlogo.png" />
<div class="headerLogo">
  <ul>
<li><a href=">#home">menybrah</a></li>
<li><a href=">#home">anothaone</a></li>
<li style="float:right"><a href=">#home">todaright</a></li>
</ul>

</div>

<h3>Linear Gradient - Diagonal</h3>
<p>This linear gradient starts at top left. It starts red, transitioning to yellow:</p>

<div id="grad1"></div>

<p><strong>Note:</strong> Internet Explorer 9 and earlier versions do not support gradients.<$

</body>
</html>

更多的词更多的词更多的词更多的词更多的词更多的词更多的词更多的词更多的词更多的词更多的词更多的词更多的词更多的词更多的词更多的词更多的词更多的词更多的词更多的词更多的词更多的词更多的词更多的词更多的词更多的词更多的词更多的词更多的词字多字多字多字多字多字多字多字多字多字多字多字多字多字多字>

【问题讨论】：

请添加JSFiddle
我不知道那是什么
jsfiddle.net/tcou4dk3/2（点击链接，添加您的 HTML 和 CSS，然后将该链接添加到您的帖子中）
不要为此使用 JS Fiddle。堆栈溢出allows you to put live demos in your question.
您需要提供minimal reproducible example。 “我无法在导航栏上方显示我的徽标。”除非您的代码包含导航栏，否则毫无意义。

标签： html css

【解决方案1】：

像这样将您的徽标放在导航上方

.header {
float:left;
margin:auto;
display:inline-block;
background:black;
padding:5px;
width:100%;
color:white;
}
.logo
{
width:32px;
height:32px;
}

<div>
  <img class="logo"
     src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcSN1_sXp8T6higZFr994Vr8QUmav0Lqw2XYTimUhflQcI_Lo3ojLFjOGfg" />
</div>

<div class="header">
  <h5>Navigation bar</h5>
</div>

【讨论】：

“你的标志在导航栏里面”——是什么让你这么想？问题代码中没有导航栏。