Kysymys navigation baarista

[kapsu]

Morjesta,

Sellaista asiaa olisin kysellyt, että löysin mukavan navigation baarin (http://www.w3schools.com/css/tryit.asp?filename=trycss_navbar_horizontal_float_advanced) juuri omaan tarpeeseen, mutta tuli pieni ongelma siinä vastaan.

Elikkäs kuten jo linkin kautta näkyy koodin pätkä:

CSS:

Koodia:

.navi

ul
{
list-style-type:none;
margin:0;
padding:0;
overflow:hidden;
}
li
{
float:left;
}
a:link,a:visited
{
display:block;
width:120px;
font-weight:bold;
color:#FFFFFF;
background-color:#98bf21;
text-align:center;
padding:4px;
text-decoration:none;
text-transform:uppercase;
}
a:hover,a:active
{
background-color:#7A991A;
}

SIVU:

Koodia:

<div class="navi">

<ul>
<li><a href="#home">Home</a></li>
<li><a href="#news">News</a></li>
<li><a href="#contact">Contact</a></li>
<li><a href="#about">About</a></li>
</ul>

</div>

Ja tämän haluaisin divin sisäään, mutta kun liitin pätkän css tiedostoon niin kaikki sivuilla olevat tekstit muuttuivat kyseisellä stylellä. Joten miten pystyn rajaamaan tämän, että kyseinen style pysyy vain tässä omassa divissä, eikä käytä sitä muualla sivustolla?

En tiedä oliko tämä epäselvästi kysytty, mutta kysykää lisää

[TrashWebs]

En tiedä oliko tämä epäselvästi kysytty, mutta kysykää lisää

Snadisti mutta tajusin pointin. Ymmärtääkseni haluat että tuo pätkä CSS:ää vaikuttaa ainoastaan div class=navi:iin?

Huomasin että tuossa navigaatiossa käytetään suoraan HTML:lään upotettua CSS:ää, suosittelen käyttämään ulkoista CSS - tiedostoa.
Sinun pitäisi määritellä nuo css:än kohdat eri tavalla, esim.

Väärin: Tässä esimerkissä vain ensimmäinen määrittely vaikuttaa navi - divin <ul> elementtiin.
Ja muut käsittääkseni koko sivuun.

Koodia:

.navi ul{
plaaplaa
}
li {
}

Oikein: Kun taas tässä määrittelyt vaikuttava navin <li>,<ul> ja <a> elementteihin, mutta ei muun sivuston samoihin elementteihin.

Koodia:

.navi ul{
plaaplaa
}
.navi li{
plaaplaa
}

.navi a{
plaaplaa
}

Upotetun CSS:än haittapuoli on se, että jos haluat muuttaa ko. sivustosi ulkoasua, joudut käymään kaikki sivut läpi ja etsiä sieltä ne kohdat joihin haluat muutokset, kun taas ulkoinen css - tiedosto vaikuttaa jokaiseen html - dokumenttiin jossa on viitatty kyseiseen css - tiedostoon.

Kuulostaako utopialta?

Elikkä selventääkseni vielä:
Ota käyttöön ulkoinen css tiedosto, pääset helpomalla.
Kysy toki apua, jos tarvitset.
Jos tarvitset reaaliaikaista apua, MSN messenger ja Gmail löytyy. Mulla ainakin