CSS-də em vahidlərinə giriş

em vahidləri şrift ölçüsünü valideyn elementin ölçüsündən faizlə təyin etməyə imkan verir. Gəlin bir nümunəyə baxaq.

Tutaq ki, bizim iç-içə olan belə teqlər var:

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

Gəlin div elementimizə şrift ölçüsü təyin edək:

cssdiv {
  font-size: 20px;
}

Abzas elementinə isə 2em ölçüsü təyin edək. Bu dəyər valideynin şrift ölçüsündən iki dəfə böyük şriftə uyğundur:

cssp {
  font-size: 2em; /* 40px-ə uyğundur */
}

İndi isə abzasa 0.5em ölçüsü təyin edək. Bu dəyər valideynin şrift ölçüsünün yarısına uyğundur:

cssp {
  font-size: 0.5em; /* 10px-ə uyğundur */
}

1em dəyəri abzasın şrift ölçüsünü valideyn div elementində olduğu kimi edəcək:

cssp {
  font-size: 1em; /* 20px-ə uyğundur */
}

Praktiki tapşırıqlar

Tutaq ki, bizim üçün məsələləri həll edəcəyimiz HTML kodu var:

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

Aşağıdakı kodu icra etmək nəticəsində li teqlərinin px ilə ifadədə hansı şrift ölçüsünə malik olacağını müəyyən edin:

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

Aşağıdakı kodu icra etmək nəticəsində li teqlərinin px ilə ifadədə hansı şrift ölçüsünə malik olacağını müəyyən edin:

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

Aşağıdakı kodu icra etmək nəticəsində li teqlərinin px ilə ifadədə hansı şrift ölçüsünə malik olacağını müəyyən edin:

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