div class=""

asdasddas

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?

2

825

    Vastaukset

    Anonyymi (Kirjaudu / Rekisteröidy)
    5000
    • 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

    1. Nyt tuli Suomen somaleista todella ikävää faktaa

      sillä osa somalivanhemmista lähettää lapsiaan kotimaahansa kurinpitolaitoksiin, joissa heitä pahoinpidellään. Illan MOT
      Maailman menoa
      333
      3953
    2. Häirintäkohun keskellä olevalta kansanedustajalta Jani Kokolta (sd) rajua tekstiä somessa.

      https://www.is.fi/politiikka/art-2000011772322.html Ajaakohan tämä SDP:n kansanedustaja Jani Kokko oikein täysillä valoi
      Maailman menoa
      128
      3600
    3. Kommentti: oikeuslaitos korvattava SDP:n johdolla

      Näkisin että Suomessa tuomiovalta pitäisi olla demareiden johtoportaalla. Koska porvarimedia säestettynä persujen kirku
      Maailman menoa
      5
      2312
    4. Onko kaivattusi spesiaali?

      Millä tavalla ja miten?
      Ikävä
      112
      1714
    5. Huono päivä

      Tänään on ollut tosi raskas päivä töissä. Tekis mieli itkeä ja huutaa. En jaksa just nyt mitään. Minä niin haluaisin ja
      Ikävä
      18
      1658
    6. Typeryyttä

      Se on kummallista, kun kaksi ihmistä tuntee selittämätöntä vetoa toisiinsa, mutta eivät vain pääse toistensa luokse. Mik
      Ikävä
      124
      1359
    7. Lindtman haluaa leikata Kela-korvauksista...oho!

      Antti Lindtman sanoo Kauppalehdessä, että vuodesta 2028 voi tulla erittäin hankala, mikäli nykyinen hallitus ei tee riit
      Maailman menoa
      102
      975
    8. Martina mukana erikoisjoukossa

      Huippurankka Erikoisjoukot-ohjelma jatkuu, Martina mukana. Kerrankin Martinalle hyvä ohjelma, hänellä on voimaa, sisua j
      Kotimaiset julkkisjuorut
      144
      973
    9. Häneen rakastuminen oli sellaista

      että aina uskoi ja luotti että kyllä tästä vielä edetään jotenkin. Se olikin vain rakastuneen toiveajattelua kaikki. Ta
      Ikävä
      79
      885
    10. Huonosti.

      Oletko kohdellut kaivattuasi huonosti? Miksi?
      Ikävä
      86
      791
    Aihe