font-size - CSS | html style font size
Usinganemvaluecreatesadynamicorcomputedfontsize(historicallytheemunitwasderivedfromthewidthofacapital"M"inagiventypeface.).Thenumericvalueactsasamultiplierofthefont-sizepropertyoftheelementonwhichitisused.Considerthisexample:Inthiscase,thefontsizeof
elementswillbedoublethecomputedfont-sizeinheritedby
elements.Byextension,afont-sizeof1emequalsthecomputedfont-sizeoftheelementonwhichitisused.Ifafont-sizehasnotbeensetonanyofthe
sancestors,then1emwillequalthedefaultbrowser...
Using an em value creates a dynamic or computed font size (historically the em unit was derived from the width of a capital "M" in a given typeface.). The numeric value acts as a multiplier of the font-size property of the element on which it is used. Consider this example:
In this case, the font size of <p> elements will be double the computed font-size inherited by <p> elements. By extension, a font-size of 1em equals the computed font-size of the element on which it is used.
If a font-size has not been set on any of the <p>s ancestors, then 1em will equal the default browser font-size, which is usually 16px. So, by default 1em is equivalent to 16px, and 2em is equivalent to 32px. If you were to set a font-size of 20px on the <body> element say, then 1em on the <p> elements would instead be equivalent to 20px, and 2em would be equivalent to 40px.
In order to calculate the em equivalent for any pixel value required, you can use th...