Page 1 of 1
Horizontales CSS Menü
Posted: Fri Oct 27, 2006 6:37 pm
by geisi
Hallo bin mit meiner Seite mittlerweile ein bißchen fortgeschritten, leider bin ich aber mit CSS noch nicht so ganz vertraut.
Das was ich nicht ganz kapiere, bzw nicht weiß ob es möglich ist, ist ob die Untermenüs eine andere Hintergrundfarbe haben können als das Hauptmenü.
mfg
geisi
Re: Horizontales CSS Menü
Posted: Mon Oct 30, 2006 1:37 pm
by zulaut78
Hallo geisi,
weiss ja nicht inwiefern du dich mit dem Aufbau des CMS auskennst. Es gibt die Möglichkeit im Adminbereich unter Layout -> Stylesheets die Stylesheets zu editieren. In deinem Fall wäre das Nav - Horizontal Stylesheet.
Code: Select all
/* A CSS Framework by Mike Stenhouse of Content with Style, adapted to CMSMS by Daniel Westergren */
[color=Red]/* NAV */
* html div#menu_horiz {
/* hide ie/mac \*/
height: 1%;
/* end hide */
}
div#menu_horiz {
background-color: #ECECEC;
width: 100%;
margin: 0;
text-align: center;
}
div#menu_horiz ul {
margin: 0;
padding: 0;
list-style: none;
border-bottom: 1px solid #C0C0C0;
border-left: 1px solid #C0C0C0;
}
div#menu_horiz li {
float: left;
display: inline;
list-style: none;
margin: 0 ;
border-right: 1px solid #C0C0C0;
}
div#menu_horiz li a {
border-right: none;
}
div#menu_horiz a,
div#menu_horiz a:link,
div#menu_horiz a:active,
div#menu_horiz a:visited {
display: block;
padding: 5px 10px;
/* hide from ie/mac \*/
display: block;
/* end hide */
text-decoration: none;
margin: 0;
color: #18507C;
background: #ECECEC;
}
div#menu_horiz li a:hover {
background-color: #abb0b6;
}
div#menu_horiz .activeparent {
display: inline-block;
/* hide from ie/mac \*/
display: block;
/* end hide */
background-color: #abb0b6;
}
div#menu_horiz .current a,
div#menu_horiz .current a:link,
div#menu_horiz .current a:active,
div#menu_horiz .current a:visited,
div#menu_horiz .current a:hover,
div#menu_horiz .activeparent a,
div#menu_horiz .activeparent a:link,
div#menu_horiz .activeparent a:active,
div#menu_horiz .activeparent a:visited,
div#menu_horiz .activeparent a:hover
{
background-color: #abb0b6;
}
/* END NAV */[/color]
Dieser Bereich des Stylesheets greift auf die Navigation und deren Unterpunkte.
Da das Menue eigentlich eine ganz normale Liste ist und per Javascript umformatiert wird, solltest du die Bereiche li (Liste) und ul (untergeordneter Listenpunkt) bearbeiten und die Menuepunkte anders gestalten können.
Vorsicht.. um nichts zu zerschießen solltest Du während Du in dem Stylesheet arbeitest eine Sicherungskopie erstellen..
Bei Fragen einfach nochmal Posten..
mfg Marco
Re: Horizontales CSS Menü
Posted: Wed Nov 01, 2006 4:50 pm
by geisi
Das mit den stylesheets hatte ich schon gewußt, aber es ist extrem umständlich, wenn man nicht genau weiß was man sucht etwas zu ändern, speichern, schauen was hat sich verändert, usw
Aber ich hab hier im Forum etwas weitergelesen, und bin dabei dann auf das Firefox Plugin Web Developer gestoßen, und muß sagen : Das ist echt ein Hammer wie einfach das ganze mit dem dann geht.
Die Homepage ist somit bis auf ein paar Kleinigkeiten fertig, und das ganze dank eines super CMS
