Hyrje në njësitë em në CSS

Njësitë em ju lejojnë të vendosni madhësinë e fontit në përqindje nga madhësia e prindit. Le të shohim një shembull.

Supozoni se kemi etiketat e mbivendosura si më poshtë:

html<div>
  <p>
    text
  </p>
</div>

Le të vendosim madhësinë e fontit për div-in tonë:

cssdiv {
  font-size: 20px;
}

Dhe për paragrafin, le të vendosim madhësinë në 2em. Kjo vlerë i përgjigjet një fonti dy herë më të madh se madhësia e fontit të prindit:

cssp {
  font-size: 2em; /* i përgjigjet 40px */
}

Tani le t'i vendosim paragrafit madhësinë në 0.5em. Kjo vlerë i përgjigjet gjysmës së madhësisë së fontit të prindit:

cssp {
  font-size: 0.5em; /* i përgjigjet 10px */
}

Vlera 1em do ta bëjë fontin e paragrafit të njëjtë me atë të div-it prind:

cssp {
  font-size: 1em; /* i përgjigjet 20px */
}

Detyra praktike

Supozoni se kemi kodin HTML, për të cilin ne do të zgjidhim detyra:

html<ul>
  <li>text</li>
  <li>text</li>
  <li>text</li>
</ul>
Задание 1

Përcaktoni, çfarë madhësie fonti në px do të kenë etiketat li si rezultat i ekzekutimit të kodit në vijim:

cssul {
  font-size: 10px;
}
li {
  font-size: 2em;
}
Задание 2

Përcaktoni, çfarë madhësie fonti në px do të kenë etiketat li si rezultat i ekzekutimit të kodit në vijim:

cssul {
  font-size: 20px;
}
li {
  font-size: 1.5em;
}
Задание 3

Përcaktoni, çfarë madhësie fonti në px do të kenë etiketat li si rezultat i ekzekutimit të kodit në vijim:

cssul {
  font-size: 30px;
}
li {
  font-size: 0.5em;
}