Mitä eroa on :llä ja :lla?
Ja miten käytetään class-systeemiä, kun minä tiedän vain tuosta id-jutusta? Ja hommaillaan sivut mahdollisimman paljon css:ää käyttäen tuon class-jutun avulla. Kun olen joidenkin sivujen lähdekoodia katsellut, niin niissä on hyvin paljon -juttuja. Miten laittaa sitten tyylitiedostoon?
div class=""
asdasddas
2
960
Vastaukset 2
- sebe-zeus
id = yksilöivä tunniste, nimi johon voidaan viitata
class = luokka, tyylitiedostoon määritelty ominaisuusryhmä vaikkapa tyyliin
.keltainen
{
font-family:verdana,arial,helvetica;
font-size: 10pt;
font-weight: bold;
color: #FFFF00;
} Siinä missä useampi elementti voi kuulua samaan luokkaan yhtä aikaa, voi myös yksittäinen elementti kuulua useaan luokkaan samanaikaisesti. Esimerkki:
CSS:
p.lorem { color: yellow; }
p.ipsum { background-color: black; }
HTML:
Tähän tulee keltaista tekstiä mustalla taustavärillä.
Lisäksi ID-valitsimella on suurempi spesifisyys (= "painoarvo") kuin luokkavalitsimella, joten ristiriitatilanteissa ID-valitsimen avulla ilmoitetut määritykset voittavat. Esimerkki 1:
CSS:
#lorem { color: red; }
.ipsum { color: blue; background-color: black; }
HTML:
Tähän tulee punaista tekstiä mustalla taustavärillä.
----------
Esimerkki 2:
CSS:
#lorem p { color: yellow; background-color: black; }
div .ipsum { color: red; font-style: italic; }
HTML:
Tähän tulee keltaista kursivoitua tekstiä mustalla taustavärillä.
On siis tärkeää huomata, että molemmat tyylisäännöt otetaan huomioon p-elementin muotoilussa. Kuitenkin ristiin menevien määritysten kohdalla (tässä tapauksessa color-ominaisuus) suuremman spesifisyyden saava valitsin voittaa.
Valitsimen spesifisyys:
http://www.w3.org/TR/CSS21/cascade.html#specificity
Ketjusta on poistettu 0 sääntöjenvastaista viestiä.
Luetuimmat keskustelut
Törkeä petosepäily Suomussalmella
Uutisoi maikkari. Uhrin nimiin on nostettu pankkilainaa, hänet on saatu sijoittamaan hevosiin ja ostamaan autoja. Ei ta733099Poliisi etälamautti, sitten pahoinpiteli
Vaikeasti kehitysvammaisen niin vakavasti että kuoli pian sairaalassa. Ei osannut kehitysvammainen heti noudattaa polii3681155Mies, olen pahoillani kun olen kuvitellut
Että pitäisit minusta. En sitä mistään tähdistä kuitenkaan lukenut, mulle vaan tuli jostain semmoinen tunne, kun itse ty65805Anni Ihamäki saa tylyä kommenttia TTK:sta - Erityisesti tämä "vääryys" ärsyttää
Kaikille ei ole mieleen se, että Anni Ihamäki on mukana uudella Tanssii Tähtien Kanssa -kaudella. Ihamäki saa varsin ty32769Mitä et ole valmis sietämään ihmissuhteissasi ja miksi?
Aiemmin jo kyseltiin mitkä vaatimukset olivat mielestänne liiallisia. Kyselläänkin nyt sitä, että millaisilla asioilla s263656Päivän Riikka: Pandan suklaatehdas Jyväskylästä Viroon
Menkää töihin! Viroon! --- Liki sata vuotta kestänyt suklaantuotanto makeisvalmistaja Pandan tehtaalla Vaajakoskella pä140598Tiesitkö? Vappu Pimiän ensimmäinen aviomies ei ole Teemu-rakas
Vappu Pimiä on tätä nykyä naimisissa Teemu Huuhtasen kanssa. Pimiä on toista kertaa naimisissa, sillä ensimmäinen liitto19589Älä nyt ylikuormitu vaikka sinusta pidänkin rakas nainen
Tiedän, että olet minulle oikea. En halua pilata tätä juttua malttamattomuudella, mutta epäilen. Haluan vain olla lähel31568Älä katoa elämästäni
Kävelyllä mietin olisitpa varjo takanani vierelläni sivullani Älä katoa koskaan ole siinä pidä kädestäni kiinni ole kan30518Sysmä tarvitsee päätöksiä
Sysmä tarvitsee päätöksiä – ei p*anjauhantaa** Kirjoitan kuntapolitiikan ulkopuolisena tarkkailijana. Sysmän poliittinen17515