|
|
Das Layout
Dies ist die Bonus-Version2 (index2.html). Hier geht es zurück zur Version1 index.html
Dieses Design heisst: "Shooting!".
Die junge Frau auf dem Foto schaut Ihren Besuchern tief in die Augen. Damit wir sofort eine Beziehung zu Ihren Besuchern hergestellt. Viel Spaß damit.
Die Technik
Die Breite der Gesamtkonstruktion beträgt 960 Pixel der Breite des Bildschirms. Ausgehend von diesem Wert bekommt die rechte Spalte mit der Navigation 260 Pixel Breite, die Spalte mit Foto und Inhalt erhält automatisch immer den Rest der Breite. Die vorstehend genannten Werte sind auch veränderbar, und zwar in der CSS-Datei bei:
#breite {width:960px}
und
#navigation_breite {width:260px}
Seite ohne Frames. Anlegen von Links bzw. HTML-Seiten wie folgt: Die Datei Startdatei "index.html" ist zu kopieren und jeweils unter einem neuen Namen abzuspeichern.
Übrigens: Unterhalb der Menü-Boxen in der rechten Spalte könnten Sie auch weitere Boxen anlegen, für kleineren Inhalt wie Bilder, Text, Logo, Werbung o.ä. Als Beispiel haben wir hier mal die Zitat-Box eingefügt.
Die Navigation
Textlinks. Die Beispiel-Textlinks sind durch Ihre Links zu ersetzen. Sie sehen bezüglich der Menüs 4 Rubriken mit jeweils 7 - 9 Links. Das ist nur ein Beispiel. Die Anzahl der Rubriken sowie auch die Anzahl der jeweiligen Links sind beliebig zu erweitern bzw. natürlich auch zu verkürzen.
Die allgemeinen Links (Links im Text) sehen zur Zeit aus wie nachstehend: Um den Mouseover-Effekt anzuschauen, fahren Sie mit der Maus über den Link: Beispiel-Link
Der Bonus
Wir haben noch eine zweite Version index2.html für Sie. Diese Version passt sich den unterschiedlichen Monitorgrössen Ihrer Besucher an. Es ist eine Prozent-Konstruktion.
Die Breite der Gesamtkonstruktion beträgt 86% der Breite des Bildschirms. Ausgehend von diesem Wert bekommt die rechte Spalte mit der Navigation 260 Pixel Breite, die Spalte mit Foto und Inhalt erhält automatisch immer den Rest der Breite. Die vorstehend genannten Werte sind auch veränderbar, und zwar in der CSS-Datei bei:
#breite_version2 {width:86%}
und
#navigation_breite {width:260px}
Der Tipp
Abschliessend haben wir hier noch für Sie einige Tipps bezüglich dieser Vorlage anbei: tipps.html.
Praesent nisl mi, condimentum sed, bibendum semper, fringilla a, felis. Phasellus tincidunt odio vel nulla. Morbi vitae urna quis nulla imperdiet rhoncus. Aliquam feugiat, nulla non semper mollis, sapien velit rutrum urna, eu vehicula erat risus et leo.eugiat, nulla non semper mollis, sapien velit rutrum urna, eu vehicula erat risus et leo.
|
|
» Navigation.First.
» Navigation. Second.
»
Navigation. Third.
»
Navigation. Fourth.
»
Box1. Zitat.
"Imperdiet rhoncus. Aliquam feugiat, nulla non semper mollis, sapien velit rutrum urna, eu vehicula erat risus et leo".
|