iceblue-test
  Eigene Navi-Buttons
 

Design Iceblue : Eigene Navi-Buttons:

Auf dem Bild die Klassen im Design "Iceblue" . Die Buttons der Navigation haben die Klasse nav bekommen . Egal welche Klasse verwendet wird , schreibt ein td. davor . Das td. steht für Tabellenspalte . Korrekt heißt es dann td.nav .
(Bild anklicken zum vergrößern)


Original-Button Größe : 185 x 33 Pixel		 Das ist der Original-Button. Der neue muss in gleicher Größe erstellt werden! Für den Hover-Effekt einen zweiten.


Eigener Navi-Button :


  • Navi-Buttons für Iceblue, fertig zum kopieren : www.free-picture.de.tl
  • mit Rechtsklick auf deinem PC speichern
  • oder (wenn vorhanden) mit Grafikprogramm erstellen in Größe 185 x 33


  • fertigen Button hochladen bei "Bilder verwalten"
  • bei "Bilder verwalten" den Namen des Bildes anklicken
  • nun mit der Maus auf das Bild
  • mit Rechtsklick auf "Eigenschaften", da steht BILD-URL
  • diese BILD-URL kommt in den Code


Einfügen im Feld "Text über Design"

<style type="text/css">
<!--

/* Navi-Button */
td.nav {
    background-color: #xxxxxx;
    background-image: url(Button-URL 1); }

/* Navi-Button Hover-Effekt */
td.nav:hover {
    background-color: #xxxxxx;
    background-image: url(Button-URL 2); }

/* Navi-Link Farbe und Größe */
td.nav a {
    color: #000000;
    font-size: 14px;
    font-family: arial,verdana;
    text-align: left;
    text-decoration: none; }

/* Navi-Link Hover */
td.nav a:hover {
    color: #000080; }

/* aktuell besuchte Seite */
tr.checked_menu td {
    background-color: #6f8ac4;
    background-image: url(Button-URL 3); }

-->
</style>


Wenn Ihr nur Hintergrundfarbe für Buttons möchtet:

  • bei background-image: none; die Klammer leer lassen
  • fügt bei background-color: einfach Eure Wunschfarben ein
  • zum Beispiel Blauer Hintergrund mit #000080;
  • oder Roter Hintergrund mit #800000;
  • Farbcode-Palette findet Ihr hier : Farbcode-Tabelle










  
  TESTTESTTEST  
 
• dies ist der Inhalt im < div id="popup1" >
• befindet sich im Feld "Text UNTER Design"
• das DIV ist nur auf einer Seite zu sehen
• und auf dieser Seite wurde das Design entfernt
• angezeigt wird also nur der Inhalt des einen DIV