06-04-2012, 00:46
Witam może i ja się podepnę pod temat, słuchajcie mam mały problem, może mi ktoś dać wskazówkę jak mam wystylizować menu w css tak, by w każdym z linków był inny obrazek i po najechaniu myszką zmieniał się ?
KOD HTML:
<div id="menu">
<ul>
<li><a href="start.html"></a></li>
</ul>
</div>
<div id="menu">
<ul>
<li><a href="uslugi.html"></a></li>
</ul>
</div>
<div id="menu">
<ul>
<li><a href="monitoring.html"></a></li>
</ul>
</div>
<div id="menu">
<ul>
<li><a href="klienci.html"></a></li>
</ul>
</div>
<div id="menu">
<ul>
<li><a href="pomoc.html"></a></li>
</ul>
</div>
<div id="menu">
<ul>
<li><a href="kontakt.html"></a></li>
</ul>
</div>
KOD CSS:
#menu {
width:128px;
height:90px;
float:left;
margin-left:auto;
margin-right:auto;
}
ul, ul li {
display: block;
list-style: none;
margin: 0px;
padding: 0px;
}
ul {
float: left;
background-color: #8B2527;
padding: 0px 0 0px 0px;
border: 0px solid #000;
}
ul li {
float: left;
}
ul a:link, ul a:visited {
text-decoration: none;
display: block;
font-weight: bold;
background: url(;
color: #000000;
padding: 10px 30px;
border-right: 0px solid #fff;
border-right: 0px solid #fff;
}
ul a:hover {
background-color: #8C0015;
background:url...;
}
KOD HTML:
<div id="menu">
<ul>
<li><a href="start.html"></a></li>
</ul>
</div>
<div id="menu">
<ul>
<li><a href="uslugi.html"></a></li>
</ul>
</div>
<div id="menu">
<ul>
<li><a href="monitoring.html"></a></li>
</ul>
</div>
<div id="menu">
<ul>
<li><a href="klienci.html"></a></li>
</ul>
</div>
<div id="menu">
<ul>
<li><a href="pomoc.html"></a></li>
</ul>
</div>
<div id="menu">
<ul>
<li><a href="kontakt.html"></a></li>
</ul>
</div>
KOD CSS:
#menu {
width:128px;
height:90px;
float:left;
margin-left:auto;
margin-right:auto;
}
ul, ul li {
display: block;
list-style: none;
margin: 0px;
padding: 0px;
}
ul {
float: left;
background-color: #8B2527;
padding: 0px 0 0px 0px;
border: 0px solid #000;
}
ul li {
float: left;
}
ul a:link, ul a:visited {
text-decoration: none;
display: block;
font-weight: bold;
background: url(;
color: #000000;
padding: 10px 30px;
border-right: 0px solid #fff;
border-right: 0px solid #fff;
}
ul a:hover {
background-color: #8C0015;
background:url...;
}