Css Menü mit grafiken machbar?

**PeterCool** · 28.04.2006 23:31

hallo an die gemeinde.
ich habe ein kleines problem
ich brauche ein menü wie das ( sihe Bild)
menue.gif
so das erste Problem ist es muss komplet in css definiert werden. auserdem sollen die einzelnen butten durch bilder ersetzt werden, natürlich Rollover.
und auserdem muss wenn ich eine CSS datei verwende in der da menü nicht gebraucht wird das ganze menü verschwunden sein.

also ich habe dann eine CSS (mitmenü.css) mit dem menü
und auf der gleichen seite eine CSS(ohne menü da muss dann alles weg sein
menue2.gif

so hat jemand eine Idee??
ich hänge mal den code an den ich schon habe.
habe der einfachheit halber css und seite in einem.

HTML-Code:

<html>
<head>
<title>test</title>
<style type="text/css">
  body {
    font: normal 100.01% Helvetica, Arial, sans-serif;
    color: black; background-color: #ffffe0;
  }

  ul#Navigation {
    margin: 0; padding: 0.8em;
    text-align: center;
    border: 1px solid black;
    background-color: silver;
  }
  ul#Navigation li {
    list-style: none;
    display: inline;
    margin: 0.4em; padding: 0;
  }

  ul#Navigation a, ul#Navigation span {
    padding: 0.2em 1em;
    text-decoration: none; font-weight: bold;
    border: 1px solid black;
    border-left-color: white; border-top-color: white;
    color: maroon; background-color: #ff9900;
  }
  * html ul#Navigation a, * html ul#Navigation span {
    width: 1em;    /* nur fuer IE 5.0x erforderlich */
    w/idth: auto;  /* sicherheitshalber fuer IE 6 zurueckgesetzt */
  }
  ul#Navigation a:hover, ul#Navigation span {
    border-color: white;
    border-left-color: black; border-top-color: black;
    color: white; background-color: gray;
  }

</style>

</head>

<body  bgcolor="#121212"  leftmargin="2"  topmargin="2">
<table width="964" height="125"    border="1"  bgcolor="#999999">
  <tr> 
    <td height="22" colspan="4"><img src="images/nopic.gif" width="360" height="20" border="0" ></td>
  </tr>
  <tr> 
    <td width="17" height="70" rowspan="2"><img src="images/nopic.gif" width="1" height="1"></td>
    <td width="757" rowspan="2" align="left" valign="top"> 
      <div id="test"> W&auml;hlen Sie aus der Liste</div>
	  <ul id="Navigation">
    <li><a href="#Beispiel">Seite&nbsp;1</a></li>
    <li><a href="#Beispiel">Seite&nbsp;2</a></li>
    <li><a href="#Beispiel">Seite&nbsp;3</a></li>
    
    <li><a href="#Beispiel">Seite&nbsp;5</a></li>
    <li><a href="#Beispiel">Seite&nbsp;6</a></li>
  </ul>
      </td>
    <td width="133" height="39"><img src="images/nopic.gif"></td>
    <td width="29" rowspan="2"><img src="images/nopic.gif"></td>
  </tr>
  <tr>
    <td height="44"  align="right"> 
      <div align=top >kommt was hin


</div>

 </td>
  </tr>
  <tr> 
    <td height="1" colspan="4"><img src="images/nopic.gif"></td>
  </tr>
</table>


</body>
</html>

währe super wenn jemand helfen kann

Gruss Peter

**PeterCool** · 29.04.2006 13:15

hat den keiner eine idee wie ich sowas machen kann?? oder einen link.

**GevatterTod** · 29.04.2006 13:28

Hintergrund ist doch kein Problem:

a {
background: #FFFFFF url(relativer Pfad zu Bild a) repeat-x left;
}

a:hover {
background: url(relativer Pfad zu Bild b);
}

Hier jetzt die zusammenhängende Schreibweise.
Wenn du es trennen willst, dann sind background-image, background-repeat und background-position deine Freunde, siehe hier >> http://www.css4you.de/backgroundproperty.html

Über den Punkt mit dem Verschwinden grübel ich weiter nach, bis ich es verstanden habe.

Thema: Css Menü mit grafiken machbar?

LinkBack

Themen-Optionen

Thema durchsuchen

Anzeige

Css Menü mit grafiken machbar?

Ähnliche Themen

Horizontales Menü mit Grafiken

Neue Seite - Fragen zu CSS und Menü

CSS Menü

css Menü Top

Css Probleme wegen zu vielen Menü punkten

Lesezeichen

Lesezeichen

Berechtigungen