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

919

    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. Riikka runnoo: datakeskuksille tulee UUSI yritystuki

      "Suomen valtio erikseen tukee esimerkiksi kryptovaluuttaan tai aikuisviihteeseen tai muuhun keskittyviä datakeskuksia."
      Maailman menoa
      38
      2091
    2. Eläkeläiset siirrettävä muuttotappioalueille

      Joutoväki pois ruuhkauttamasta elättäjien arkea. Samalla putoaa jokaisen asumiskulut ja rahaa jää enemmän kuluttamiseen.
      Maailman menoa
      170
      1858
    3. Onko kivaa jättää

      elämän suurin rakkaus hiljaisuuteen?
      Ikävä
      115
      1289
    4. En kerro nimeäsi nainen

      Sillä olet nyt salaisuus jota kannan sydämessäni. Tämä mitä tunnen ja kuinka sinuun vahvasti ihastuin on jo niin erikoin
      Ikävä
      71
      1130
    5. Mitä haluaisit sanoa hänelle tänään?

      Kerro tähän viestisi. 🍭🍡🍦
      Ikävä
      91
      885
    6. Olet kiva ihminen

      En kiellä sitä yhtään. Sinussa on hyvin paljon erinomaisia puolia, enemmän varmasti kun meissä muissa. Sitten on puoli
      Ikävä
      71
      845
    7. Uuden upotuskasteen vaiettu ongelma

      Alkuseurakunnan kaste oli useamman vuosisadan upotuskaste, joka toimitettiin joko ulkona luonnon vesistöissä tai kasteki
      Kaste
      43
      826
    8. Auta mua mies

      Ota vielä yhteyttä, keksi oikeat sanat että vuosien ajan kasvanut muuri murtuu meidän väliltä vaikka aluksi vain vähän.
      Ikävä
      77
      805
    9. Ja tääkin vielä...

      Kukakohan on valittanut, Salmiko itse? https://www.viiskunta.fi/rehtori-valittiin-ahtarissa-ilman-hakumenettelya-o/13479
      Ähtäri
      31
      763
    10. Minkälaisen viestin toivoisit saavasi?

      Miehelle.... Helpota vähän.
      Ikävä
      54
      681
    Aihe