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:

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

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

div {
	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:

p {
	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:

p {
	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:

p {
	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:

<ul>
	<li>text</li>
	<li>text</li>
	<li>text</li>
</ul>

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:

ul {
	font-size: 10px;
}
li {
	font-size: 2em;
}

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:

ul {
	font-size: 20px;
}
li {
	font-size: 1.5em;
}

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:

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