Heute werden Navigationsmenüs in (X)HTML-Dokumenten mit Listen und CSS erstellt. Das Tutorial gibt einen Überblick über die Methoden zum Erstellen und Formatieren vertikaler Menüs und erklärt, wie man diese schnell in horizontale Menüs umwandelt.
Tipps: Werbeflächen
An
<html>
<head>
<style type="text/css">
<!--
ul#navigation {
margin: 0px;
padding: 0px;
list-style-type: none;
}ul#navigation li {
padding: 0px;
margin: 0px;
display: inline;
}ul#navigation li a:link {
border: 1px solid #000;
background-color: #CCCCCC;
padding: 2px 5px 2px 5px;
font-size: 12px;
color: #000;
font-family: Arial, Helvetica, sans-serif;
text-decoration: none;
font-weight: bold;
}ul#navigation li a:hover {
border: 1px solid #000;
background-color: #333333;
padding: 2px 5px 2px 5px;
color: #fff;
}
-->
</style>
</head>
<body>
<ul id="navigation">
<li><a href="start.html">Startseite</a></li>
<li><a href="news.html">News</a></li>
<li><a href="infos.html">Informationen</a></li>
<li><a href="galerie.html">Galerie</a></li>
<li><a href="links.html">Links</a></li>
<li><a href="kontakt.html">Kontakt</a></li>
<li><a href="impressum.html">Impressum</a></li>
</ul>
</body>
</html>
