Darstellung des Navigationslayouts
Hallo. Ich habe Probleme, den Code für das Navigationslayout im Bild (oben) zu schreiben. Ich möchte, dass das Logo, bei dem es sich um ein Bild handelt, links und die Menüverknüpfungen in der Mitte angezeigt werden. Wie würde das in CSS geschrieben werden?
Dies ist der HTML-Code für diesen Teil:
<header id="header">
<div class="img">
<a href="landingpage.html"><img src="/logo.png" alt="image of the logo" id="header-img" width="175px" height="52px"></a>
</div>
<nav id="nav-bar">
<ul id="menu">
<li><a class="nav-link" href="#menu1">menu1</a></li>
<li><a class="nav-link" href="#menu2">menu2</a></li>
<li><a class="nav-link" href="#menu3">menu3</a></li>
</ul>
</nav>
</header>
Muss ich möglicherweise zuerst einige Änderungen im HTML vornehmen?
Danke im Voraus!
#header {
display:flex;
justify-content: center;
}
.img{
position: absolute;
left: 0;
}
#nav-bar{
align-self:center;
}
<header id="header">
<div class="img">
<a href="landingpage.html"><img src="/logo.png" alt="image of the logo" id="header-img" width="175px" height="52px"></a>
</div>
<nav id="nav-bar">
<ul id="menu">
<li><a class="nav-link" href="#menu1">menu1</a></li>
<li><a class="nav-link" href="#menu2">menu2</a></li>
<li><a class="nav-link" href="#menu3">menu3</a></li>
</ul>
</nav>
</header>
Dieser Artikel stammt aus dem Internet. Bitte geben Sie beim Nachdruck die Quelle an.
Bei Verstößen wenden Sie sich bitte [email protected] Löschen.
Lass mich ein paar Worte sagen