CSS හි උරුමකම සහ em ඒකක

දැන් අපට වඩාත් ගැඹුරු සම්බන්ධතාවයක් ඇතැයි සිතමු:

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

main ටැගයට පහත අකුරු ප්‍රමාණය ඇතැයි සිතමු:

main {
	font-size: 10px;
}

div ටැගය සඳහා අකුරු ප්‍රමාණය em වලින් සකසමු:

div {
	font-size: 2em; /* px 20 ට අනුරූප වේ */
}

යොමුවට ද em වලින් අකුරු ප්‍රමාණය සකසමු. මෙම අවස්ථාවේ දී, එය එහි ප්‍රමාණය ගණනය කරනු ලබන්නේ දැනටමත් ගණනය කළ div එකේ අකුරු ප්‍රමාණයට අනුපාතිකව ය:

p {
	font-size: 2em; /* px 40 ට අනුරූප වේ */
}

ප්‍රායෝගික ගැටළු

අපට ගැටළු විසඳන ඒ සඳහා HTML කේතයක් ඇතැයි සිතමු:

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

පහත කේතය ක්‍රියාත්මක කිරීමේ ප්‍රතිඵලයක් ලෙස div වලට ඇති අකුරු ප්‍රමාණය px වලින් නිර්ණය කරන්න:

section {
	font-size: 10px;
}
div {
	font-size: 2em;
}

පහත කේතය ක්‍රියාත්මක කිරීමේ ප්‍රතිඵලයක් ලෙස යොමු වලට ඇති අකුරු ප්‍රමාණය px වලින් නිර්ණය කරන්න:

section {
	font-size: 10px;
}
div {
	font-size: 2em;
}
p {
	font-size: 1.5em;
}

section {
	font-size: 40px;
}
div {
	font-size: 0.5em;
}
p {
	font-size: 0.5em;
}