WAITING FOR - Die Homepage

         
    

Das Design.

What are you waiting for. Oberhalb und unterhalb des Fotos sehen Sie einen Schatten, welcher das Foto plastischer erscheinen läßt. Diese Schattenanteile würden sich auch automatisch Ihrem eigenen Bild anpassen, da diese sozusagen über dem Foto liegen. Sanctus est Worauf wartest Du? Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor » what r u waiting 4 « invidunt ut labore et dolore magna


Die Technik.

Die Logo-Grafik haben wir für Sie noch ein zweites Mal verändert, sprich ein komplett anderes Foto gewählt, damit Sie sehen können, wie die oben angesprochenen Schattenanteile sich auf einem anderen Foto auswirken. Klicken Sie bitte die Datei index2.html anbei. Der Homepagename (als Text) sowie auch die 3 Sterne liegen über der Logo-Hintergrund-Grafik. Alle diese Objekte sind damit verschiebar bzw. anderes zu positionieren. Wer wenig Inhalt im Text hat, kann die Höhe des Inhaltsfeldes in der Datei format.css bei #inhalt anders einstellen. Zur Zeit steht dort ein Wert von 900 Pixel Höhe (height). Bei mehr Text verlängert sich die Höhe des Feldes ja sowieso automatisch. Auch die Gesamtbreite der Konstruktion ist einstellbar in Pixel oder Prozent. Zur Zeit hat die Vorlage diesbezüglich einen Wert von 994 Pixel.


Die Navigation.

Die Beispiel-Textlinks sind durch Ihre Links zu ersetzen. Das obere Menü ist ein Prozent-Menü, hier sind es 5 Links mit je 20% (= 100%), natürlich veränderbar. Alle Links haben somit die selbe Breite. Beim zweiten Menü unten in der Fusszeile passen sich die Links automatisch an, die Links sind je nach Linklänge unterschiedlich breit, dieses Menü hat aber den Vorteil, das es platzsparender ist.


Bonus.

Für Sie, wenn Sie möchten. Anbei ist noch eine Bonus-Grafik für das Logo-Foto (namens logo_bonus.png). Diese enthält den blauen blanko Farbverlauf, so daß Sie selbst ein wenig damit probieren können. Klicken Sie dafür die Datei index3.html für das Beispiel.

Nachfolgend sehen Sie zwei Beispiele für Listen. Listen sind textliche Aufzählungen. Durch die Einrückung lockern Listen auch jeden Text auf. Dies sind nur Beispiele, die Ihnen als Anregung gelten sollen, natürlich können Sie jede der Listen verlinken oder auch nicht verlinken. Jede der Listen können Sie natürlich auch um weitere Listenpunkte nach unten erweitern. Hier sehen Sie eine sogenannte numerierte Liste (ol = ordered list), d.h. die Ziffern werden bei jedem weiteren Listenpunkt automatisch vorangestellt.

Numerische Liste, Ziffern automatisch fortlaufend, nicht verlinkt:
  1. Curabitur
  2. Ullamcorper
  3. Magna
  4. Aenean

Anlegen von Links bzw. HTML-Seiten wie folgt: Die Datei Startdatei "index.html" ist zu kopieren und jeweils unter einem neuen Namen abzuspeichern. Praesent nisl mi, condimentum sed, bibendum semper, fringilla a, felis.

Numerische Liste, Ziffern automatisch fortlaufend, verlinkt:
  1. Sed
  2. Condimentum
  3. Bibendum
  4. Semper

Maecenas a nulla. Maecenas nisl. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Mauris eu massa. In semper. Morbi vitae nisl at felis placerat porttitor. Morbi molestie. Cras ligula sapien, consequat sed, scelerisque ut, pulvinar vel, sem. In vulputate gravida orci.
© 2013  |  WHAT ARE YOU WAITING FOR  |  Worauf wartest Du?
www.ihre-webseite-beispiel-hier.de