Navigationen
Vorraussetzungen
HTML Grundkenntnisse und ein eigenes Layout
Einfach nur ganz normale Links in die Navigation einfügen? Sieht oftmals leider nicht sehr schön aus. Deshalb zeige ich euch, wie ihr eure Navigationen stylen könnt.
Ihr braucht nur einen Code, den ihr im Head Bereich eures Layouts einfügt, zwischen < style> und < /style>.
Der Code für die Navigation ist dieser:
Die Erklärung:
A.navi:link, A.navi:active, A.navi:visited: Eigenschaften der Navigations Links, im normalen Zustand
A.navi:hover: Eigenschaften der Navigations Links, wenn man mit der Maus drüber fährt
display: block: Die Navigation wird untereinander aufgereiht
padding-right: Abstand vom Content
color: Schriftfarbe
font-family: Schriftart
font-size: Schrift Grösse
background-color: Hintergrund Farbe
margin-bottom: Abstand von der Navigations Links
border-bottom: Unterer Rand des Links
border-left: Linker Rand des Links
border-right: Rechter Rand des Links
border-top: Oberer Rand des Links
letter-spacing: Abstand der Buchstaben
text align: Ausrichtung des Links
line-height: Linien Höhe des Navigations Links
Ihr müsst im Code zwischen 2 Teilen unterscheiden, der eine ist der Link im normalen Zustand, also wie er immer zu sehen ist. Der andere fängt beim
A.navi:hover an. Dieser Bereich ist der, wenn man mit der Maus über einen Link fährt.
Ihr könnt alles verändern, wie ihr möchtet, wenn ihr z.B. alle Links großbuchstabig anzeigt werden, müsst ihr noch ein
text-transform:uppercase; hinzufügen. Genauso ist es mit dem Rand, ihr könnt ihn normal (solid), gepunktet (dotted) oder gestrichelt (dashed) machen.
Der Link kann ein Hintergrund bekommen (statt
background-color: #000000; einfach
background: url('URL DES HG BILDES'); einfügen), kursiv (
font-style: italic;) oder dick (
font-weight: bold;) werden.
Probiert es einfach mal aus.
Wollt ihr diese Navigations Links nun benutzen, braucht ihr diesen Code:
Statt Navigations Titel tragt ihr natürlich Home, Gästebuch etc. ein, je nachdem wie der Link heißen soll.
Habt ihr nun eine Navigation mit 5 Punkten, sollte euer Code so aussehen:
In einem anderen Tutorial (
Klick) könnt ihr nachlesen, wie man Boxen erstellt. Wollt ihr die Navigations Links also in einer Box, braucht ihr so einen Code:
Wenns noch Fragen gibt, schreibt sie mir ins Askme.
(Copyright by Chriskizzmysun, kopieren ist strikt untersagt!)
Welcome here
Willkommen auf meinem Blog, auf dem ich über meinen Alltag & alles was mich bewegt schreibe. Über Feedback freue ich mich & bei Gefallen, verfolgt meinen Blog mithilfe verschiedener Funktionen. Have Fun! 
(IE/Firefox optimiert)
01. » Main / Blogging Life
02. » About chriskizzmysun
Woman behind
KOPF AUS. HERZ AN. Pictures fade.
Chrissi (22), aus Bremen, verheiratet und Mama von Carrie.
Liebt Tattoos (4) und Piercings (24), Fotografie, Schuhe, STARBUCKS
, Pink, Erdbeeren,
Glitzer, Kitsch, Shopping und Frühling.
Hat ihr Herz vor langer Zeit in
HAMBURG gelassen
.
{{ ..Zeiten ändern sich. Momente vergehen. Doch Erinnerungen bleiben.
}}
» Mehr erfahren?
» Unser Kind Carrie Milana
» Die Liebe - Mein Mann
...Dass uns niemals etwas trennen kann.
Ich liebe Dich. - 27.07.2009 -
Kategorien
...Und vieles mehr.
› Tagen glücklich vergeben
› und Tagen verheiratet.
› Carrie Milana ist Tage alt
› Tage seit dem letzten Hamburg Besuch
--------------------------------------------------
› Noch Tage bis zum Hamburg Trip
› Noch Tage bis zu Carrie's 2.Geburtstag
› Noch Tage bis Weihnachten
› Und Tage bis Silvester.
