Elementti, jolla on useita CSS-luokkia

Yksittäiselle tagille voidaan määrittää useita CSS-luokkia samaan aikaan. Tätä varten luokat on lueteltava class-attribuutissa välilyönnillä erotettuina.

Katsotaanpa esimerkkiä. Oletetaan, että meillä on useita CSS-luokkia:

css.error {
  color: red;
}
.large {
  font-size: 30px;
  font-family: Arial;
}

Määritetään kappaleelle sekä yksi luokka että toinen:

html<p class="error large">
  lorem ipsum
</p>
Задание 1

Oletetaan, että sinulla on seuraavat luokat:

css.success {
  color: green;
}
.error {
  color: red;
}
.large {
  font-size: 30px;
}
.small {
  font-size: 20px;
}

Oletetaan myös, että sinulla on 4 kappaletta. Esitettyjen luokkien avulla tee niin, että ensimmäinen kappale on vihreä ja isolla fonttikoko, toinen kappale - punainen ja pienellä fonttikoko, kolmas kappale - punainen ja isolla fonttikoko, ja neljäs - vihreä ja pienellä fonttikoko.

Задание 2

Keksi ja toteuta 3 jotain luokkaa. Määritä jollekin tagille samanaikaisesti kaikki keksimäsi luokat.