[CSS HTML] Efektywność jedynie dla menu nawigacyjnego

0

Panowie jak zrobić, żeby efektywność odsyłaczy w 'Menu' funkcjonowała tylko właśnie do tego menu. Tak, aby odsyłacze po za 'Menu' nie miały takiego samego efektu.

//DEKLARACJA MENU

<div id="Menu">
<ul>
<li><a href="#str"><b>Strona główna</b></a></li>
<li><a href="#str"><b>Test</b></a></li>
</ul>
</div>
// Chcę, aby ten kod funkcjonował tylko w 'Menu'

a:active, a:hover, a:link, a:visited
{
    text-decoration: none;
    border-top: 5px solid gray;
    margin-left: 25px;
    font-size: 25px;
    color: gray;
}
// Menu

#Menu
{
    border: 5px solid orange;
    height: 40px;
    width: 100%;
    margin-top: 30px;
    float: left;
    color: white;
}
0

Efektywność... Po pierwsze to radzę się nauczyć ściślej wyrażać swoje myśli. Efektywność to w takim kontekście nieadekwatne słowo i gdyby nie przykładowy kod, to nie miałbym zielonego pojęcia o co chodzi.

A chodzi o to, by pewna grupa reguł CSS dla różnych typów linków stosowała się wyłącznie do linków w menu nawigacyjnym.

Odpowiedź jest prosta: poczytaj o selektorach CSS (css selectors). Musisz je opanować.

W tym konkretnym przypadku powinno to wyglądać tak:

#Menu a:active,
#Menu a:hover,
#Menu a:link,
#Menu a:visited 
{
    text-decoration: none;
    border-top: 5px solid gray;
    margin-left: 25px;
    font-size: 25px;
    color: gray;
}

A jestem praktycznie przekonany, że wymienianie w ten sposób wszystkich kategorii linków (link, visited itd.) jest zupełnie zbędne. W żadnych przypadkach trzeba to zrobić, a tu zapewne tego nie ma. Więc wystarczy po prostu:

#Menu a
{
    text-decoration: none;
    border-top: 5px solid gray;
    margin-left: 25px;
    font-size: 25px;
    color: gray;
}

I mówię: NAUCZ SIĘ jak to działa, nie kopiuj, nie przepisuj. To nic nie da. Będziesz tworzył bezsensowny kod, tak jak prawdopodobnie zrobiłeś tutaj, bo widziałeś, że ktoś gdzieś użył a:visited i a:link. Musisz wiedzieć, czemu potrzebujesz takiego i takiego kodu i czemu inny kod nie działa. Kodując na pałę, na ślepo, bez zrozumienia, nie zbliżasz się nawet do programowania.

0

Wielkie dzięki. No cóż masz rację, wystarczy sam selektor. W HTML'u i cssie siedzę dopiero pierwszy dzień, a i tak dość szybko się uczę. I po tym dniu już wiem na czym cały ten design polega itp :)

0

W braku wiedzy jako takim nie ma niczego złego i nie należy się tego wstydzić. Szczególnie gdy dopiero zaczynasz przygodę z daną technologią.

Co innego, gdy właśnie sprzedajesz napisany w tej technologii projekt klientowi, któremu powiedziałeś, że jesteś wysokiej klasy specjalistą... ;)

PS. No i jeszcze ważne jest w jakim kierunku się idzie. Stąd Ci napisałem, których rzeczy nie możesz ominąć, jeśli chcesz rozsądnie pracować z CSS. Tak podstawowe selektory z CSS1 to mus; na razie możesz zupełnie olać te z CSS3, a nawet większość z CSS 2.1 możesz zostawić sobie na później. Selektor ID (#ident), klasy (.klasa), typu elementu (p), selektor uniwersalny (*) i podstawowe pseudoklasy (np. :hover) musisz mieć opanowane, bo ich używa się non stop. To samo dotyczy łączenia selektorów prostych podstawowymi kombinatorami (choćby samą spacją) i grupowania selektorów (czyli oddzielania kilku selektorów przecinkami).

1 użytkowników online, w tym zalogowanych: 0, gości: 1