Variable Breite der Menüpunkte...?

[Jonas800]

Hallo zusammen

Zur Zeit arbeite ich ja gerade mit dem Buch "Adobe Dreamweaver CS4 - Das umfassende Handbuch" von Richard Beer und Susann Gailus. Darin wird ja eine Beispielseite aufgebaut. Die benötigten Bilder sind auf der mitgelieferten CD vorbereitet. Mir fällt auf, dass die Menüpunkte (Home, Kontakt, Bilder,...) als Bild gespeichert sind. Mein Ziel ist es aber, dass man die Menüpunkte erst nachträglich hineinschreibt, so wie es bei diesen Vorlagen der Fall ist:

homepage vorlagen, homepagevorlagen ( templates )

Das Problem:
Auf meiner eigenen Seite möchte ich einen Menüpunkt Home. Bei diesem Button hat es vor dem "Home" einige Abstände und dahinter einige Abstände (siehe Bild). Danach folgt ein Unterbruch und der zweite Menüpunkt "Über mich" kommt. Auch hier wieder hat es die gleiche Anzahl Abstände vor dem "Über mich" und dahinter. Usw.
Dazu möchte ich, dass man z.B. jetzt "Über mich" im Dreamweaver (oder einem anderen Webeditor) löschen kann und dann etwas anderes hineinschreiben kann. Was wichtig ist, dass die Abstände davor und dahinter gleich bleiben und dass sich die Länge automatisch anpasst (ebenfalls auf dem Bild erkennbar).

Jetzt verstehe ich es nicht ganz: wenn man nämlich die Menüpunkthintergründe beispielsweise im Photoshop erstellt (mit dem dazugehörigen Abstand??), wie muss ich dann vorgehen, dass sie sich autmatisch der Länge anpassen? Muss ich den Abstand (weisser Balken zwischen zwei Menüpunkten) ebenfalls im Photoshop erstellen, oder wie müsste ich da vorgehen?

Hier das Bild:


Gruss Jonas

 

[wex_stallion]

AW: Variable Breite der Menüpunkte...?

Das kann man über CSS formatieren. Google mal nach "CSS Menu Generator", da gibt es diverse von. Da sind einige, die Vorlagen haben die deiner ähneln. Bau dir da zwei oder drei Menupunkte und dann guck dir den Code einfach ganz genau an.

Das hab selbst ich gerafft, und ich kann Webzeuch garnich

 

[Jonas800]

AW: Variable Breite der Menüpunkte...?

<ul id="menu">
    <li><a href="#" title="Home">Startseite</a></li>

<ul> bezeichnet laut Selfhtml eine Auflistung. Ist also ein Menu (horizontal) html-technisch betrachtet eine Auflistung.
<a href=".."> ist ja im Grunde ein Verweis auf eine Seite oder Datei. Wobei zwischen den Anführungszeichen der Zielordner (oder z.B. die WWW-Adresse) hinkommt. Was bedeutet aber in diesem Falle dieses Zeichen #? Was macht das Zeichen #, wo normalerweise das Zielverzeichnis hinkommt?

Kann ich dann das für mein eigenes Menu einfach so kopieren? Also den bestehenden Code des Menus entfernen und durch einen solchen ersetzten?

Liebe Grüsse,
Jonas

 

[wex_stallion]

AW: Variable Breite der Menüpunkte...?

Du kannst den Code dann anpassen. # ist ein Platzhalter, da schraubst du dann den Link zu dem Bild hin.

CSS an sich ist, zumindest bei dem optischen Kram, ziemlich selbsterklärend. Ein kleines bisschen Englisch sollte man vielleicht beherrschen, aber ich denk mal "background-color" & Co. erklären sich wirklich selber.

 

[Jonas800]

AW: Variable Breite der Menüpunkte...?

# ist ein Platzhalter

Logisch^^ - sorry, hatte dabei nicht überlegt.

Die Menubar muss ich mir nochmals genauer unter die Lupe nehmen. Sobald ich das Kapitel durchhabe, werde ich versuchen, eine solche Menubar zu erstellen. Probieren geht über studieren, vielleicht komme ich ja sogar selber noch auf einen Trick?

Aber das mit dem "CSS Menu Generator" war eine geniale Idee, so lernt man es am besten =) - danke für diesen Tipp

Gruss Jonas

 

[silver129]

AW: Variable Breite der Menüpunkte...?

Ich kann dir da nur Xtreeme DHTML Menu Studio empfehlen. Gibt es als demo. Sind auch viele Vorlagen drin. Habe mir das Menü auch damit erstellt.