我正在尝试将导航器放在我的徽标旁边,它只是将它放在它下面。我的代码不是很好,但是我希望导航设置在徽标的旁边,就像我在设计中一样:
HTML:
<body>
<div class="backgroundofdivgreen">
<header>
<div class="logo"><a href="index.html"><img src="images/logo.jpg"></a></div>
<nav>
<a href="index.html">Home</a>
<a href="services.html">Services</a>
<a href="offers.html">Offers</a>
<a href="people.html">People</a>
<a href="franchises.html">Franchises</a>
<a href="reviews.html">Reviews</a>
</div>
</header>
</div>
CSS:
body {
margin: 0px;
background-color:blue;
}
.backgroundofdivgreen {
height: 96px;
margin: 0px;
background-color: #39b54a;
}
header {
width: 980px;
height: 96px;
background-color: #39b54a;
margin: 0px auto;
}
nav {
float:right;
}
答案 0 :(得分:0)
将float: left;
应用于.logo
课程,然后使用<nav>
`关闭</nav> . not with
:
body {
margin: 0px;
background-color: blue;
}
.backgroundofdivgreen {
height: 96px;
margin: 0px;
background-color: #39b54a;
}
header {
width: 980px;
height: 96px;
background-color: #39b54a;
margin: 0px auto;
}
.logo {
float: left;
}
nav {
float: right;
}
&#13;
<body>
<div class="backgroundofdivgreen">
<header>
<div class="logo">
<a href="index.html"><img src="images/logo.jpg"></a>
</div>
<nav>
<a href="index.html">Home</a>
<a href="services.html">Services</a>
<a href="offers.html">Offers</a>
<a href="people.html">People</a>
<a href="franchises.html">Franchises</a>
<a href="reviews.html">Reviews</a>
</nav>
</header>
</div>
&#13;