Gunnar Bittersmann: Frames /Srcollbar für ein gesamtes Framset

Beitrag lesen

@@Matthias Apsel:

nuqneH

Eine Navigationsliste ist eine Liste (<ul>). Dann brauchst du auch keine Leerzeichen und Trenner (|)

Etwas mager Information für einen Anfänger.

Das Markup sollte in etwa so aussehen:

<div id="navi" role="navigation">  
  <img scr="../box2/jpeg" width="xxx" height="yy" alt="das ist murtzel als Sie klein war und andere" title="logo"/>  
  <ul>  
    <li><a href="../box2/seiten/index.html">home</a></li>  
    <li><a href="../box2/seiten/kontakt.html">kontakt</a></li>  
    <li><a href="../box2/seiten/buchung.html">Buchung</a></li>  
    <li><a href="../box2/seiten/impressum.html">impressum</a></li>  
  </ul>  
</div>

Wobei das Bild vielleicht eher Verzierung ist, also ein Hintergrundbild per CSS, kein 'img' im Markup.

In HTML5 ist 'nav' statt 'div' angesagt.

Zu beachten ist auch, dass die aktuelle Seite im Menü nicht verlinkt sein sollte. (Punkt 10 der zehn meist-missachteten Homepage-Design-Richtlinien [Nielsen])

Im Stylesheet:

#navi ul  
{  
  list-style: none;  
  margin-left: 0;  
  padding-left: 0;  
}  
  
#navi li  
{  
  display: inline;  
}  
  
#navi li:not(:last-child)::after  
{  
  content: " | ";  
}

Oder mit Rücksicht auf Browser, die das nicht verstehen:

#navi li  
{  
  border-left: 1px solid;  
  display: inline;  
  padding: 0.5em;  
}  
  
#navi li:first-child  
{  
  border-left: none;  
  padding-left: 0;  
}

Qapla'

--
Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
(Mark Twain)