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

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

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

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

cssmain {
  font-size: 10px;
}

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

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

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

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

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

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

html<section>
  <div>
    <p>
      text
    </p>
  </div>
</section>
Задание 1

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

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

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

csssection {
  font-size: 10px;
}
div {
  font-size: 2em;
}
p {
  font-size: 1.5em;
}
Задание 3

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

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