Navi-Leiste Hintergrundbilder

[B-ellanna]

HAllo, nun habe ich schon wieder ein Problem kaum das das letzte gelöst ist.
Ich möchte gerne 2 Bilder als hintergrund für meine Navigationsleiste haben. Einmal wenn man mit der Maus draufgeht und einmal in allen anderen Fällen.
Das Bild wird brav hochgeladen aber es wird abgeschnitten und mit background: width oder height hab ich es nicht in der Größe ändern können.
Ich hoffe ich habe verständlich mein Problem beschrieben.
Vielen Dank für eure Hilfe,
B-ellanna
Das Navigationsmenü ist eine Liste und hier ist das CSS:
ul#Navigation { font-size: 1.0em;
      float: left;
      width: 10em;
      margin: 0; padding: 0.0em;
      border: none;
      color:#995c00;
      background-color: #fcde9c;
      text-align: center;
    }
ul#Navigation li {
  list-style: none;
      margin: 0.1em; padding: 0;
    }
ul#Navigation a {
      display:block;
      padding: 0.2em;
      width: 10em;
      text-decoration: none;
      font-weight: bold;
      border: 0px solid black;
      border-left-color: white;
      border-top-color: white;
      color: #995c00;
      background: #fcde9c url(./bilder/Parchment_off.gif) no-repeat center;
      }
ul#Navigation a:hover {
      border-color: white;
      border-left-color: black;
      border-top-color: black;
      color: #995c00;
      background: #fcde9c url(./bilder/Parchment_on.gif) no-repeat center;
      }

[Detlef G.]

Hallo B-ellanna

Das Bild wird brav hochgeladen aber es wird abgeschnitten und mit background: width oder height hab ich es nicht in der Größe ändern können.

Natürlich nicht, CSS kann (noch) keine Hintergrundbilder skalieren.
Hier siehst du, welche Eigenschaften du dem Hintergrund (background)
zuweisen kannst, width und height sind nicht dabei.

Auf Wiederlesen
Detlef

[B-ellanna]

Natürlich nicht, CSS kann (noch) keine Hintergrundbilder skalieren.
Hier siehst du, welche Eigenschaften du dem Hintergrund (background)
zuweisen kannst, width und height sind nicht dabei.

Hallo,
Das ist ja echt schade, also muß cih doch blöde pixelgraphiken einzeln hochladen und für den Mouseover Effekt ein Javascript nutzen?
Gibt es da nicht eine elegante Lösung mit css? Muß ich da die Button-Graphiken auf eine annehmbare Höhe und Breite bringen und dann einbinden?
Irgendwelche Ideen?
Ich danke euch !
B-ellanna

[Detlef G.]

Hallo B-ellanna

Das ist ja echt schade, also muß cih doch blöde pixelgraphiken einzeln hochladen

Und was ist da der Vorteil?
Vom Browser skalierte Grafiken sehen doch meist bescheuert aus.

Gibt es da nicht eine elegante Lösung mit css?

Ich weiß nicht wofür genau.
Was sind das für Grafiken?
Wie sehen diese aus?

Muß ich da die Button-Graphiken auf eine annehmbare Höhe und Breite bringen und dann einbinden?

Grafiken solltest du immer mit einem Grafikprogramm auf die richtige Größe
bringen.
Button-Grafiken, die auch den Linktext enthalten nehmen dem Nutzer die
Möglichkeit die Schriftgröße zu ändern, ohne dass der Browser Grafiken
skalieren muss.

Irgendwelche Ideen?

Ideen - mehrere, aber ohne zu wissen, wie die Links aussehen sollen, kann
ich dir kaum sinnvolle Vorschläge machen.

Auf Wiederlesen
Detlef

[B-ellanna]

Ideen - mehrere, aber ohne zu wissen, wie die Links aussehen sollen, kann
ich dir kaum sinnvolle Vorschläge machen.

Hallo,

Hm ist klar.
Ich sollte mir whsl endlich mal die Domain von meinem Kumpel übergeben lassen. Dann geht das alles viel einfacher.

Ich hab es jetzt auch einigermaßen hübsch hinbekommen (mit fester line-height: 2em) nur wenn man die Schriftgröße vergrößert rutscht die Schrift über den Rand des Gifs hinaus. Und Wenn man es verkleinert dann sieht man nur noch die Mitte der Graphik.

Ich möchte die Buttons nicht in jedes html file einzeln reinschreiben müssen, sondern für jeden Navigationsleisten-Link so eine kleine Schriftrolle (weils für eine Mittelalter-Seite ist) als Hintergrund. Ja und eben diese zeigt oben beschriebenen Effekt.
Da hab ich nämlich gelesen, dass das die Ladezeit extrem verkürzt wenn man immer nur ein Bild für die Navi hochlädt, als 5 oder mehr, halt für jeden Listenpunkt ein eigenes.

So das ist der Grund warum ich nciht jedesmal ein einzelnes Bild hochladen möchte und ich weiß zusätzlich jetzt einmal wie man diesen schönen rollovereffekt per hover macht. Und den möchte ich nciht wieder rausnehmen, was ja wohl sein müßte wenn ich die Buttons definiere.

Hoffentlich hab ich es jetzt gut genug beschrieben. Besser ginge es natürlich mit Beispiel aber dazu hab ich ja schon was geschrieben.

Eine Gute Nacht wünscht:
B-ellanna