Suche im Forum:
Suchen


Autor Nachricht
Beitrag17.09.2012 um 15:16 (UTC)    
Titel: Navi-Buttons einfügen
Antworten mit Zitat
Hallo liebe Leute Very Happy

ich würde gerne das Beispeillayout 1 benutztne von folgender URL:
http://www.homepage-baukasten.de/forum/viewtopic.php?t=134832

Das ist ja alles kein Problem für mich. Nun was ein Problem ist,dass ich nicht weis wie ich die Links in der linken Box mit Navibuttons verschönenrn kann bzw. wie ich dort Navibuttons mithilfe von CSS einfügen kann.

Es würde mich sehr freuen,wenn mir da jemand weiterhelfen könnte Wink
______________
Mit freundlichen Grüßen,
Turbopage|net Team

Hallo! Schön dass du hier bist. Wie du sicherlich weißt, ist Turbopage eine Webmaster Hilfe-Plattform im Homepage Baukasten. Falls du Fragen hast, bist du hier, im Forum schonmal richtig!. Wir helfen dir aber auch auf Turbopage! Schaue dich da doch auch mal um.

Support via Email an Support@Turbopage.net oder via Forum auf Turbopage. Im Notfall auch via PN!
Beachte: Wir haben viel zutun, wende dich daher erst an das Forum und an die Community bevor du die Email oder den PN-Support benutzt!
↑
Beitrag17.09.2012 um 17:43 (UTC)    
Titel:
Antworten mit Zitat
Hallo,
eine Navigation besteht doch nur aus einer Auflistung von Links, die mit CSS aufgewertet wird. Da ich nicht weiß, wie du es gerne haben möchtest, habe ich einen Beispielcode geschrieben. In der Theorie sieht das also wie folgt aus:

HTML:
Zitat:
<ul id="siderbarnav">
<li><a href="#.htm">Home</a></li>
<li><a href="#.htm">About</a></li>
<li><a href="#.htm">Portfolio</a></li>
<li><a href="#.htm">Projects</a></li>
<li><a href="#.htm">Contact</a></li>
</ul>


CSS:
Zitat:
<style type="text/css">

ul#siderbarnav li{
list-style-type: none;
height: 16px;
width: 200px;
padding: 10px;
float: left;
clear: both;
background-color: #CCCCCC;}

ul#siderbarnav li:hover{
background-color: #99CCFF;
}

ul#siderbarnav li a{
display: block;
color: #000000;
}

</style>


Liebe Grüße
↑
Beitrag17.09.2012 um 18:00 (UTC)    
Titel:
Antworten mit Zitat
Versteh ich nicht Surprised

Könntest du mir das vielleicht direkt in den Code einfügen?

Code:
/* Nullformatierung für alle Browser */
*{padding: 0px; margin: 0px; }

/* Werbung positioniert */
table[height="102"] {
position: absolute;
left: 50%;
top: 8px;
margin-left: -255px; }

/* Hintergrund hinter Design */
body {
background-color: #eeeeee;
background-image: url();
font-family: arial;
font-size: 14px;
color: #000000; }

/* Design-Container */
#container {
width: 962px;
margin: 10px auto;
overflow: hidden; }

/* Headerfeld für Logo 210 x 100 */
#header_container {
width: 210px;
height: 100px;
margin-bottom: 10px;
background-color: #FFFFFF;
background-image: url();
border: 1px solid #c9c9c9; }

/* Titel im Headerfeld entfernt */
h1#header {display: none; }

/* Feld der Navigation */
#nav_container {
width: 960px;
height: 40px;
margin-bottom: 10px;
background-color: #FFFFFF;
background-image: url();
border: 1px solid #c9c9c9; }

/* Titel über Navigation entfernt */
#nav_heading {display: none; }

/* Aufzählungspunkte in Navi entfernt */
ul#nav {
list-style-type: none; }

/* Navi-Buttons */
li.nav_element {
width: 120px;
height: 40px;
float: left;
text-align: center;
border-right: 1px solid #c9c9c9;
background-color: #FFFFFF;
background-image: url(); }

/* Hover Navi-Button */
li.nav_element:hover { background-color: #202020; }

/* Linktexte in Navigation */
li.nav_element a {
display: block;
font-size: 15px;
color: #000000;
line-height: 40px;
text-decoration: none; }

/* Hover Linktexte Navigation */
li.nav_element a:hover { color: #FFFFFF; }

/* Zweites Headerfeld */
#pre_content {
width: 960px;
height: 140px;
margin-bottom: 10px;
background-color: #FFFFFF;
background-image: url();
border: 1px solid #c9c9c9; }

/* Seiteninhalt rechts platziert */
#content {
float:right;
width: 665px;
min-height: 200px;
padding: 20px 20px 20px 20px;
background-color: #FFFFFF;
background-image: url();
border: 1px solid #c9c9c9;
overflow: hidden; }

/* Titel Seiteninhalt + Titel über Box */
h2#title , #sidebar_heading {
padding: 5px 0px 5px 20px;
margin: -20px -20px 15px -20px;
background-color: #dddddd;
color: #000000;
font-size: 14px;
font-weight: normal; }

/* Link im Seiteninhalt */
#content a {color: #000080; }

/* Hover Link im Seiteninhalt */
#content a:hover {color: #008080; }

/* Rechte Box links platziert */
#sidebar_container {
float: left;
width: 200px;
min-height: 200px;
padding: 20px 20px 20px 20px;
background-color: #FFFFFF;
background-image: url();
border: 1px solid #c9c9c9;
overflow: hidden; }

/* Liste in rechter Box */
#sidebar_content ul {
list-style-type: square;
margin: 15px 0px 15px 25px; }

/* Linktexte in Box */
#sidebar_content ul li a {
color: #000000;
font-size: 14px;
text-decoration: none; }

/* Hover Linktexte Box */
#sidebar_content ul li a:hover { color: chocolate; }

/* Feld unter dem Design */
#footer {
width: 920px;
padding: 20px 20px 20px 20px;
margin: auto;
background-color: #FFFFFF;
background-image: url();
border: 1px solid #c9c9c9; }

/* unnötige Felder im Design entfernt */
#pre_header {display:none;}
#post_header {display:none;}
#post_content {display:none;}
#below_content{display:none;}
#nav_Impressum {display:none;}
#counter{display:none;}


Wäre echt nett Wink
↑
Beitrag17.09.2012 um 18:10 (UTC)    
Titel:
Antworten mit Zitat
Was soll da das Problem sein? Der HTML-Code gehört in die Sidebar und der CSS-Code in das Feld "CSS-Code ohne Style-Tags". Wink

Zitat:
ul#siderbarnav li{
list-style-type: none;
height: 16px;
width: 200px;
padding: 10px;
float: left;
clear: both;
background-color: #CCCCCC;}

ul#siderbarnav li:hover{
background-color: #99CCFF;
}

ul#siderbarnav li a{
display: block;
color: #000000;
}

/* Nullformatierung für alle Browser */
*{padding: 0px; margin: 0px; }

/* Werbung positioniert */
table[height="102"] {
position: absolute;
left: 50%;
top: 8px;
margin-left: -255px; }

/* Hintergrund hinter Design */
body {
background-color: #eeeeee;
background-image: url();
font-family: arial;
font-size: 14px;
color: #000000; }




[dein restlicher Code...]
↑
Beitrag17.09.2012 um 18:12 (UTC)    
Titel:
Antworten mit Zitat
Das ist klar ,nur habe ich dann trotzdem keine NaviBUTTONS :O

http://mrquirinho.de.tl/Home.htm
↑
Beitrag17.09.2012 um 18:19 (UTC)    
Titel:
Antworten mit Zitat
Du hast auch vergessen, der Aufzählung eine ID zu geben. Siehe HTML-Code von meinem ersten Beitrag.

Liebe Grüße
↑
Beitrag17.09.2012 um 18:27 (UTC)    
Titel:
Antworten mit Zitat
Danke jetzt gehts Very Happy Muss sie nurnoch anpassen Smile
↑
Beiträge der letzten Zeit anzeigen:   
  • Seite 1 von 1

  •  
    • Gehe zu:  


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de

© 2024 webme GmbH, Deutschland. Alle Rechte vorbehalten.