CSS Introduction | CSS Box Model | Size Units

CSS size units include %, em, px, cm, mm, and inch.

Among them, the most commonly used size units are as follows.

  1. Percentage unit(%)
  2. Multiple unit(em)
  3. Pixel unit(px)

The percentage unit(%) sets the base size to 100% and defines a relative size based on it. The multiple unit(em) sets the default size of the corresponding font to 1em and defines a relative size based on it. The pixel unit(px) sets an absolute size based on screen pixels.

<style>
    #large { font-size: 200%; }
    #small { font-size: 0.7em; }
    #fixed { font-size: 20px; }
</style>

NOTE 1x = 1em = 100%.