Peter L.: Benötige Hilfe beim anpassen eins CSS-Menüs

Guten Abend,
ich benötige bis morgen Abend ein vernünftig aussehendes CSS-Menü, ich habe mir folgendes heruntergeladen :

CSS:

/* CSS v_emf_pixel_001*/

body {
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 100.01%;
 background-color: #f7f7f7;
}
#menue {
 width: 173px;
 font-size: 80%;
 border: 1px solid #000000;
}
.menuekopf {
 font-weight: bold;
 color: #000000;
 width: 163px;
 padding: 5px;
}
#menue ul {
 list-style-type: none;
 margin: 0px;
 padding: 0px;
}
#menue li {
 display: block;
}
#menue li a, #menue li a:link {
 text-decoration: none;
 display: block;
 color: #000000;
 width: 163px;
 padding: 5px;
}
#menue li a:visited {
 color: #0066FF;
}
#menue li a:hover, #menue li a:active, #menue li a:focus {
 color: #ffcc00;
}

Und hier der HTML-Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="content-language" content="de" />
<link rel="stylesheet" type="text/css" href="v_emf_pixel_001.css" />
<title>Vertikales Menue 001-Effekte mit Farben von css-menue.de</title>

</head>

<body>
<div id="menue">
<div class="menuekopf">Men&uuml; 1</div>
<ul>
<li><a href="#">Hyperlink 1.1</a></li>
<li><a href="#">Hyperlink 1.2</a></li>
<li><a href="#">Hyperlink 1.3</a></li>
<li><a href="#">Hyperlink 1.4</a></li>
<li><a href="#">Hyperlink 1.5</a></li>
</ul>
<div class="menuekopf">Men&uuml; 2</div>
<ul>
<li><a href="#">Hyperlink 2.1</a></li>
<li><a href="#">Hyperlink 2.2</a></li>
<li><a href="#">Hyperlink 2.3</a></li>
<li><a href="#">Hyperlink 2.4</a></li>
<li><a href="#">Hyperlink 2.5</a></li>
</ul>
</div>
</body>
</html>

Nun ich bin gerade noch dabei mich in CSS reinzuarbeiten, bisher habe ich nur HTML gemacht.
Mir ist bewusst das das hier kein Forum ist wo ich einfach was reinposte nach dem Motto "Ey ihr macht mal !".

Ich hoffe trotzdem das ihr mir angesichts meines knappen Zeitlimits unter die arme greifen könnt.

Die normale Schriftfarbe soll folgende sein: #33E500
Die Farbe für die besuchten Links soll folgende sein: #E5FF00
Und die Farbe die angezeigt wird wenn die Maus drüberfährt: #E56600

Das waren auch schon meine momentanen Probleme, wie gesagt bin ich gerade erst dabei CSS mir selber beizubringen, ich denke demnächst werde ich über diese Probleme lachen :)

Gruß Peter

  1. Die normale Schriftfarbe soll folgende sein: #33E500
    Die Farbe für die besuchten Links soll folgende sein: #E5FF00
    Und die Farbe die angezeigt wird wenn die Maus drüberfährt: #E56600

    http://de.selfhtml.org/css/eigenschaften/pseudoformate.htm#link_visited_focus_hover_active

    Du willst dann die Eigenschaft color:#33e500 setzen.

    mfg Beat;

    --
    Woran ich arbeite:
    X-Torah
    ><o(((°>           ><o(((°>
       <°)))o><                     ><o(((°>o
    1. Die normale Schriftfarbe soll folgende sein: #33E500
      Die Farbe für die besuchten Links soll folgende sein: #E5FF00
      Und die Farbe die angezeigt wird wenn die Maus drüberfährt: #E56600

      http://de.selfhtml.org/css/eigenschaften/pseudoformate.htm#link_visited_focus_hover_active

      Du willst dann die Eigenschaft color:#33e500 setzen.

      mfg Beat;

      ja das stimmt, allerdings gibt es ja vier Colorwerte.

      Einmal unter ".menuekopf {" dann unter "#menue li a, #menue li a:link {" sowie "#menue li a:visited {" und "#menue li a:hover, #menue li a:active, #menue li a:focus {"

      Bin ich dann richtig in der Annahme das ich unter

      #menue li a, #menue li a:link { die Farbe "#33E500" eintrage und unter
      #menue li a:visited { die Farbe "#E5FF00" eintrage ?

      Falls das richtig sein sollte müsste ich nur noch wissen wo ich denn die Farbe eintragen muss die angezeigt werden soll wenn ich mit der Maus drüber fahre.

      1. Falls das richtig sein sollte müsste ich nur noch wissen wo ich denn die Farbe eintragen muss die angezeigt werden soll wenn ich mit der Maus drüber fahre.

        :hover
          beschreibt den zustand, wenn ein Element mit der Maus überfahren wird.
        :activ
          beschreibt den Zustand, wenn ein Element aktiviert wird (du zum Beispiel die Maus drückst)
        :focus
          beschreibt den Zustand, wenn ein Element den Focus hat

        mfg Beat;

        --
        Woran ich arbeite:
        X-Torah
        ><o(((°>           ><o(((°>
           <°)))o><                     ><o(((°>o
      2. Hi,

        bitte zitiere sinnvoll, und nicht einfach alles.

        ja das stimmt, allerdings gibt es ja vier Colorwerte.

        Einmal unter ".menuekopf {" dann unter "#menue li a, #menue li a:link {" sowie "#menue li a:visited {" und "#menue li a:hover, #menue li a:active, #menue li a:focus {"

        Wenn du in verschiedenen Bereichen der Seite unterschiedliche Linkfarben definieren willst, dann kannst du bspw. so den Nachfahrenselektor nutzen, ja.

        Falls das richtig sein sollte müsste ich nur noch wissen wo ich denn die Farbe eintragen muss die angezeigt werden soll wenn ich mit der Maus drüber fahre.

        Das liest du unter dem Link, der dir gegeben wurde, noch mal nach.

        MfG ChrisB

        --
        „This is the author's opinion, not necessarily that of Starbucks.“
      3. Hallo Peter L,

        Bin ich dann richtig in der Annahme das ich unter

        #menue li a, #menue li a:link { die Farbe "#33E500" eintrage und unter
        #menue li a:visited { die Farbe "#E5FF00" eintrage ?

        Ob das richtig ist? Hast Du das nicht einmal ausprobiert, bevor du hier fragst? Wenn Du bis heute Abend fertig sein willst, wäre es Zeit, sich ein bisschen ranzuhalten - andererseits: das Problem ist nicht so komplex, als dass es sich nicht noch bis heute Abend lösen ließe - so lang sind die Texte hierzu nicht.

        Falls das richtig sein sollte müsste ich nur noch wissen wo ich denn die Farbe eintragen muss die angezeigt werden soll wenn ich mit der Maus drüber fahre.

        Das ist auch da erklärt, wo die anderen Pseudoformate beschrieben werden: mit Beispielen, Browserkompatibilität und allem Pipapo - wenn Du die Texte bereits gelesen hast und trotzdem etwas nicht funktioniert, helfen wir natürlich gerne weiter.

        Viele Grüße,
        Marc.

        --
        Und immer schön
        validieren (http://validator.w3.org/)