Abermals super! Danke! Last but not least noch das Problem mit dem ersten Menüpunkt im Sub-Sub-Menü: Ich habe nicht den geringsten Schimmer, wie ich hier noch die Opazität geändert bekomme - zumal es ja nur beim ersten Punkt ist:
Navitest .
HTML-Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>Navitest</title>
<style type="text/css">
body {
color: black;
background-color: black;
}
div#Rahmen {
float: left;
height: 75px;
width: 707px;
margin-top: 50px;
}
* html div#Rahmen { /* Korrektur fuer IE 5.x */
width: 48.7em;
w\idth: 47.1em;
}
div#Rahmen div {
clear: left;
}
#abschluss {
background-image: url(images/abschlussrund.png);
float: left;
height: 75px;
width: 17px;
background-repeat: no-repeat;
}
/* ********************************************************* Menü ***************************************************************/
.menu { /* Anker für das gesamte Menü */
position:relative;
margin: 0;
padding: 0;
font-family: Helvetica, Arial, sans-serif;
font-size: 9pt;
font-style: normal;
font-weight: normal;
font-variant: normal;
line-height: 23px;
text-align: center;
}
.menu li { /* Haupt-Menüelemente */
list-style: none;
float: left; /* ohne width - nach CSS 2.1 erlaubt */
position: relative;
}
.menu li ul { /* Untermenü */
margin: 0;
padding: 0;
position: absolute;
top: 24px;
display: none; /* Unternavigation ausblenden */
}
.menu li:hover ul {
display: block; /* Unternavigation in modernen Browsern einblenden */
}
.menu a, .menu span {
display: block;
position:relative;
background-image: url(images/buttonNEU_dunkel.png); /*buttons für Standard-Leistenelemente außer "Aktuell" */
width: 115px; /* Breite den in li enthaltenen Elementen zuweisen */
height: 24px;
text-decoration: none;
font-weight: lighter;
color: white;
background-color: inherit;
}
.menu ul {
position:absolute;
z-index:50;
}
.menu ul a { /* Design der Submenü-Liste */
background-image: url(images/buttonNEU_sub1-3.png);
filter: alpha(opacity=80);
opacity:0.8;
text-align:left;
padding-left: 20px;
height: 27px;
width: 95px;
line-height: 28px;
background-repeat: no-repeat;
}
.menu ul ul {
position:absolute;
top:0px;
background-image: url(images/buttonNEU_sub1-3.png);
background-repeat:no-repeat;
width:115px;
margin-left:100px;
margin-top:3px;
z-index:100;
}
.menu ul ul a {
display:none;
}
.menu ul a:hover {
background-image: url(images/buttonNEU_sub2-3.png);
text-align:left;
padding-left: 10px;
height: 27px;
width: 105px;
line-height: 28px;
background-repeat: no-repeat;
}
.menu ul a:active {
background-image: url(images/buttonNEU_sub3-3.png);
text-align:left;
padding-left: 10px;
height: 27px;
width: 105px;
line-height: 28px;
background-repeat: no-repeat;
}
.menu a:hover, .menu span, li a#aktuell {
background-image:url(images/buttonNEU_mittel.png); /* bild bei allen a:hover */
border-color: white;
border-left-color: black;
border-top-color: black;
color: white;
background-color: gray;
}
.menu a:active, .menu span, li a#aktuell {
background-image: url(images/buttonNEU_down.png); /* alle down-Buttons */
border-color: white;
border-left-color: black;
border-top-color: black;
color: white;
}
.menu ul :hover ul a {
display: block; /* Sub-Submenü in modernen Browsern einblenden */
z-index:100;
}
.menu ul ul a:hover {
background-image: url(images/buttonNEU_sub2-3.png);
background-repeat:no-repeat;
}
.menu li ul ul a:active {
background-image: url(images/buttonNEU_sub3-3.png);
background-repeat:no-repeat;
}
li a#aktuell { /* aktuelle Rubrik kennzeichnen */
background-image: url(images/buttonNEU_hell.png); /*aktuell-Button */
color: white;
background-color: inherit;
}
.menu li ul span { /* aktuelle Unterseite kennzeichnen */
background-image: url(images/buttonNEU_sub3-3.png);
position:absolute;
text-align:left;
padding-left: 20px;
height: 27px;
width: 95px;
line-height: 28px;
background-repeat: no-repeat;
}
.menu .sub_unten a {
background-image: url(images/buttonNEU_sub3_unten.png);
}
.menu .sub_unten a:hover {
background-image: url(images/buttonNEU_sub2_unten.png);
}
.menu .sub_unten a:active {
background-image: url(images/buttonNEU_sub1_unten.png);
}
.menu .space a {
background-image: url(images/buttonNEU_sub3_unten.png);
height:7px;
}
.menu .space a:hover {
background-image: url(images/buttonNEU_sub3_unten.png);
height:7px;
}
.menu .space a:active {
background-image: url(images/buttonNEU_sub3_unten.png);
height:7px;
}
.menu .sub_oben a {
background-image: url(images/buttonNEU_sub1_oben.png);
}
.menu .sub_oben a:hover {
background-image: url(images/buttonNEU_sub2_oben.png);
}
.menu .sub_oben a:active {
background-image: url(images/buttonNEU_sub3_oben.png);
}
</style>
</head>
<body>
<div id="Rahmen">
<ul class="menu">
<div id="abschluss"></div>
<li><a href="#Beispiel">Home</a></li>
<li><a href="#Beispiel">Galerien</a>
<ul>
<li class="space"><a href="#"></a>
<li><a href="#Beispiel">Fotos ›</a>
<ul>
<li class="sub_oben"><a href="'Submenü">Foto1</a></li>
<li><a href="#submenue">Foto2</a></li>
<li><a href="#submenue">Foto3</a></li>
<li<a href="'Submenü">Foto4</a></li>
<li class="sub_unten"><a href="'Submenü">Foto5</a></li>
</ul>
</li>
<li><a href="#Beispiel">Multimedia ›</a>
<ul>
<li class="sub_oben"><a href="'Submenü">Multimedia1</a></li>
<li><a href="#submenue">Multimedia2</a></li>
<li><a href="#submenue">Multimedia3</a></li>
<li class="sub_unten"><a href="'Submenü">Multimedia4</a></li>
</ul>
</li>
<li><a href="#Beispiel">Stories</a></li>
<li class="sub_unten"><a href="#Beispiel">Sonstiges</a></li>
</ul>
</li>
<li><a href="#Beispiel">Referenzen</a></li>
<li><a href="#Beispiel">Info/Kontakt</a>
<ul>
<li><a href="#Beispiel">Info</a></li>
<!-- <li><span>aktuelle Seite</span></li> -->
<li><a href="#Beispiel">Kontakt</a></li>
<li class="sub_unten"><a href="#Beispiel">Mehr...</a></li>
</ul>
</li>
<li><a href="#Beispiel">Prints & Posters</a></li>
<li><a href="#Beispiel">Blog</a></li>
</ul>
<div></div>
</div>
</body>
</html>