Delleg
26-02-2011, 18:44
Zrobiłem sobie menu w CSS-ie na podstawie tego co wygrzebałem w internecie. Aktualnie menu zachowuje się w następujący sposób
zrobiłem zaokrąglone rogi
aktywna zakładka ma odmienny kolor tła i czcionki
Jak zmienić poniższy kod tak aby po najechaniu myszką na zakładkę przybrała stan identyczny jak aktywna zakładka
#top{
background-color: #eaeaea;
width: 920px;
height: 42px;
}
#top ul {
list-style: none;
margin: 0px;
padding: 5px 0px 0px 20px;
}
#top li {
padding: 0px;
float: left;
background:url(/test/templates/blue_v2/images/rsbar.gif) no-repeat right top;
margin-right: 15px;
background-color: #464646;
}
#top a {
display: block;
background: url(/test/templates/blue_v2/images/lsbar.gif) no-repeat left top;
padding:7px 38%;
}
#top a:link, #top a:visited {
color: #fff;
text-decoration: none;
text-transform: uppercase;
font: 18px "galette", Geneva, Verdana, Arial, Helvetica, sans-serif;
}
#top a:hover {
color: #00a650;
}
#top li.active {
background:url(/test/templates/blue_v2/images/curentrsbar.gif) no-repeat right top;
background-color: #fff;
color: #464646;
}
#top li.active a {
background: url(/test/templates/blue_v2/images/curentlsbar.gif) no-repeat left top;
}
#top li.active a:link,
#top li.active a:visited {
color: #00a650;
}
zrobiłem zaokrąglone rogi
aktywna zakładka ma odmienny kolor tła i czcionki
Jak zmienić poniższy kod tak aby po najechaniu myszką na zakładkę przybrała stan identyczny jak aktywna zakładka
#top{
background-color: #eaeaea;
width: 920px;
height: 42px;
}
#top ul {
list-style: none;
margin: 0px;
padding: 5px 0px 0px 20px;
}
#top li {
padding: 0px;
float: left;
background:url(/test/templates/blue_v2/images/rsbar.gif) no-repeat right top;
margin-right: 15px;
background-color: #464646;
}
#top a {
display: block;
background: url(/test/templates/blue_v2/images/lsbar.gif) no-repeat left top;
padding:7px 38%;
}
#top a:link, #top a:visited {
color: #fff;
text-decoration: none;
text-transform: uppercase;
font: 18px "galette", Geneva, Verdana, Arial, Helvetica, sans-serif;
}
#top a:hover {
color: #00a650;
}
#top li.active {
background:url(/test/templates/blue_v2/images/curentrsbar.gif) no-repeat right top;
background-color: #fff;
color: #464646;
}
#top li.active a {
background: url(/test/templates/blue_v2/images/curentlsbar.gif) no-repeat left top;
}
#top li.active a:link,
#top li.active a:visited {
color: #00a650;
}