Witam , mam takie pytanko jak zrobić w css takie proste pionowe menu jak zrobił Pan Mirosław w odcinku "Kurs CSS (#2) Stylizacja szablonu strony. Właściwości CSS w akcji " , od razu zaznaczam ze jestem początkującym w css więc proszę o wyrozumiałość :). wiem w tym odcinku jest pokazane jak to zrobić , ktoś mógł by powiedzieć , ze przecież jest pokazane :). ;p Oczywiście ,ale mi chodzi o menu w pełni funkcjonalne tzn. na filmiku jest pokazane menu ale nie "podlinkowane" bez linków do podstron. Jak zrobić takie menu jak tam ale, żeby działały linki do podstron, kolor czcionki po najechaniu na link się zmieniał , kolor tła po najechaniu na link się zmieniał.(Wiem ,tam tez się zmienia kolor czcionki i tła , ale chodzi mi o to żeby to wszytko działało, tak samo z linkami do podstron) Próbowałem już sam to robić ale nie dałem rady.. pomoże ktoś? :) Będę wdzięczny
mój kod css menu i html:
.menu1
{
float: left;
width: 178px;
background-color: lightgray;
text-align: center;
font-size: 20px;
padding:0;
margin-bottom:20px;
border-radius: 6px;
}
ul
{
list-style-type:none;
margin:0;
padding: 20px 15px;
width:148px;
}
ul > li
{
padding-top:10px;
padding-bottom:10px;
}
a:link
{
text-decoration: none;
color: white;
}
a:visited
{
color: white;
}
a:hover
{
color: #000000
}
ul a:link
{
text-decoration: none;
color: #ffffff;
}
ul a:visited
{
text-decoration: none;
color: white;
}
ul li a:hover
{
background-color: #000000;
color: white;
cursor: pointer;
}
ul li a:link
{
color: #000000;
}
ul li a:visited
{
color: #000000;
}
ul li a:hover
{
color: #ffffff;
display:block;
padding:10px;
}
html
<div class="menu1">
<ul>
<li><a href="#">Home</a></li>
<li><a href="druzyna.html">Drużyna</a></li>
<li><a href="klub.html">O klubie</a></li>
<li><a href="historia.html">Historia</a></li>
<li><a href="transfery.html">Transfery</a></li>
<li><a href="onas.html">O nas</a></li>
<li><a href="reklama.html">Reklama</a></li>
<li><a href="kontakt.html">Kontakt</a></li>
</ul>
Proszę o to kod , teraz juz w css wprawdzie mam po najechaniu na link zmianę koloru (cały czas robie cos z tym menu , próbuje) ale .. to dalej nie jest tak jak chce , i jeszcze podejrzem ze cos zle po pisalem w tym kodzie ;d Pomożecie ? Jak to ma w gole byc poprawnie napisane , (chcialbym sie tego nauczyc rzecz jasna ;p) Chcialbym ze te menu wygladalo tak podobnie jak na tym filmiku Kurs CSS 2 Pana Mirosława tzn. tło po najechaniu na link zeby bylo takie szersze jak tam a nie przylegalo do liter (nazwy linka) ,żeby tło sie pojawialo juz wczesniej po najechaniu kursorem , a nie dopiero po najechaniu na sam link (wiecie o co chodzi ;p) jak teraz to mam.. Pomożecie? :)
takie menu jak na obrazku
P.S. mam 2 menu na stronie tzn. poziome i wlasnie pionowe i tym 2 chce miec inne kolory po najechaniu niz w 1.
