Links oberhalb der Webseite
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
attribut
befehl
code
entfernung
farbe
folgendes code
hohen leiste
kleine obere leiste
leiste
links code
links url
navigation
oberste stelle
paar
spalten
tip
trennung
treten
url
webseite
-
Ich ganz oben auf meiner Webseite eine Navigation einbauen, so in etwa wie bei Google diese kleine obere Leiste. Nur leider weiß ich nicht genau wie ich dies mit CSS umsetze. Es sollen einfach ein paar links in einer ca. 1cm hohen leiste eingesetzt werden. ich denke eigentlich kann es nicht so schwer sein. Wäre gut wenn ihr mir ein paar tipps gibt wie man dies mit CSS umsetzt.
-
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
my-easytools schrieb:
Ich ganz oben auf meiner Webseite eine Navigation einbauen, so in etwa wie bei Google diese kleine obere Leiste. Nur leider weiß ich nicht genau wie ich dies mit CSS umsetze. Es sollen einfach ein paar links in einer ca. 1cm hohen leiste eingesetzt werden. ich denke eigentlich kann es nicht so schwer sein. Wäre gut wenn ihr mir ein paar tipps gibt wie man dies mit CSS umsetzt.
Erstmal brauchst Du ein DIV.
Gleich nach <body><div id="divoben">Deine Links</div>
In die CSS das an oberste Stelle:
*{margin: 0;} #divoben {padding-left: 20px;}
Gruß Tom -
Ganz einfach:
<html> (alles überm body) <body style='margin:0px;'> <div style='border-bottom:1px solid blue; padding:5px; background-color:white;'><a href='ziel.html'>Link</a></div> <div style='margin:5px;'>(Restlicher Inhalt der Seite)</div> </body> </html>
Beitrag zuletzt geändert: 19.1.2011 21:02:50 von tropa-graciosa -
Wenn du mit divs arbeitest, dann:
* { margin: 0; padding: 0; } html {width: 100%;} body {width: 100%;} #deineleiste { widht: 100%; height: 50px; border-bottom: 1px solid #00F; }
Das ist eine Leiste im Google-Stil. Du musst #deineleiste halt durch deine ID deiner Leiste ersetzen. Die Leiste hat dann die ganze Seitenbreite. -
Schon mal danke für die ganzen Tipps. Im groben funktioniert es jetzt auch schon. Nur habe ich das Problem, dass die Links direkt nebeneinander angezeigt werden, sodass man teilweise kaum eine Trennung bemerkt z.B. HomeTest dazwischen soll eigentlich ein oder zwei leerzeichen sein. Wie bekomme ich das hin ? Außerdem wie kann ich die Farbe der Links ändern ?
-
Mit
kannst du Leerzeichen erzwingen.
Mit
hast du also zwei Leerzeichen
Zur Farbe der Links:
http://de.selfhtml.org/html/dateiweit/farben.htm#text_verweise -
Und wie kann man jetzt das Ganze noch mittig oben auf der Seite anorden ?
-
Ich weiß. das ist ne blöde Lösung und einige werden mich hier wahrscheinlich dafür treten wenn ich das hier vorschlage aber versuch mal folgendes:
<table border="1"> <tr> <td>Link 1 via <a href> </td> <td>Link 2 via <a href></td> . . . </tr> </table>
Zur Erläuterung: Das ist quasi eine Tabelle mit einer Zeile, aber mehreren Spalten. Und in jede Spalte trägst du deine Links via <a href> ein. Zusätzlich gibst du noch in deinem CSS Style Sheet noch über den CSS Befehl width: diie Entfernung der Links ein. Das geht relativ aber auch absolut.. -
my-easytools schrieb:
Und wie kann man jetzt das Ganze noch mittig oben auf der Seite anorden ?
Du müsstest, meines Wissens nach, vom div das Attribut text-align auf center stellen. -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage