Onko antaa apuja seuraavaan ongelmaan:
Kuinka homma hoidetaan CSS:llä siten, että ollessasi sivuston jollain tietyllä sivulla linkkiosiossa kyseinen linkki saadaan määriteltyä erilaiseksi kuin muut? Eli siis kuinka saadaan lennosta html:llään luotua aina kyseiselle linkille tietty class sen mukaan millä sivulla ollaan?
Kuinka homma hoidetaan CSS:llä siten, että ollessasi sivuston jollain tietyllä sivulla linkkiosiossa kyseinen linkki saadaan määriteltyä erilaiseksi kuin muut? Eli siis kuinka saadaan lennosta html:llään luotua aina kyseiselle linkille tietty class sen mukaan millä sivulla ollaan?
Vastaukset 9
Vanhimmat
Class ei ole oikea määre tähän. Käytä classiä muotoilemaan samaan tehtävään tarkoitettavia elementtejä samalla lailla. Kun taas sitten pitää kohdistaa muotoilu yksittäiseen elementtiin käytä id:tä.
Esim:
eka sivulle
toka sivulle
kolmos sivulle
Yleiset tyylitiedot omassa tiedostossaan esim tyylit.css. Siellä määrittelet esimerkiksi miten linkit näytetään yleensäkkin. Sivun alussa sitten voit määritellä head osiossa esimerkiksi vain tälle sivulle koskevia määritteitä. Kuten nyt vaikka "valitun" sivun linkin värittäminen eri värillä.
Esimerkkinä vaikka tämmöinen joka värjää ekasivun linkin valkoisella. Jos pistät tämän määritteen vain ekasivun head osioon tapahtuu väritys vain ollessasi ekasivulla vaikka sama id löytyisikin muilta sivuilta. Id on oltava luonnollisesti sivulla ns unique eli se voi esiintyä vain kerran.
a#ekasivu {color: white}
Tokihan linkkiin tarvitaan myös viittaus sivulle, eli esim. href="valikko.html"
linkki
linkki
linkki
linkki
linkki
linkki
ja muotoillaan linkit CSS:n avulla tyyliin
ul#navi a:link { }
ul#navi a:visited { }
ul#navi a:hover { }
ul#navi a:active { }
Aktiivista linkkiä varten voidaan luoda tunnisteselektori (id), luokkaselektori (class) tai vaikka käyttää pelkkää span:ia.
li#ActiveLink a { }
Jäi hreffit pois. Classi oli kuitenkin siellä ihan tarkoituksella.
Unohdit yhden jutun. Kohta joku vinee "Mix se o listassa!111".
Se on semantiikkaa opitte sen myöhemmin. Jotta siitä saisi normaalin valikon, tee näin:
ul#navi {
list-style-type: none;
padding:0;
margin: 0;
}
Onko mahdollista toimia ainoastaan tuon yhden tyylitiedoston kautta, vai vaatiiko aina kyseinen aktiivinen sivu tunnisteen/selektorin määrittämisen?
"Onko mahdollista toimia ainoastaan tuon yhden tyylitiedoston kautta, vai vaatiiko aina kyseinen aktiivinen sivu tunnisteen/selektorin määrittämisen?"
Toki, säännöt ulkoiseen tiedostoon ja sitten sivulle jolla ollaan annetaan navissa se id, class tai mitä ikinä sitten käytetäänkä'än.
Kiitokset. Asia selkis. Se, mikä tässä oli ongelmana, oli se, että linkkini ovat yhdessä taulukossa ja tuon taulukon olen linkittänyt kaikille sivuston sivuille .inc-tiedostona (kyseessä .asp-sivut).
Sain ohjeidenne mukaan homman toimimaan, mutta ongelmaksi muodostuu se, että tuohon yhteen .inc-tiedostoon en voi määritellä mikä sivu kulloinkin on kyseessä.
Mutta nyt kuitenkin vastaisuudessa osaan tuon homman tehdä, kunhan linkkejä ei haeta kaikille sivuille yhtenä tiedostona vaan sama linkkiosio toistuu joka sivulla sillä erotuksella, että aktiivisen sivun linkki on aina merkattu omalla classilla tai id:llä.