Some descriptions of font units in HTML

HTML pages, commonly used are px, PT,%, EM, REM

The problem we encountered before using EM, percent, was calculation, and when the nesting level was too long it would be very difficult to control, and the PX would be fixed dead,

Now we don't have to worry about this problem with REM, because REM's Reference object is only the root node. We simply set the size of the root node, and all child nodes can be designed simply by referencing it.

The following is a comparison of PX, EM, percent, and pt.

This refers to a network above the control picture, convenient reference

According to the above chart (the red part is the default, of course, different browser render default value is not the same, the specific needs of you to test) can be seen,

We just set the HTML root element font size to 75%, the corresponding PX value is 12, so we can easily set the width of the page and font size,

Of course the unit is REM, so that the reference object will always be HTML instead of the parent element, when the need to change, just change the size of the HTML other elements will change accordingly.

Some descriptions of font units in HTML