By using this site you agree to the use of cookies by Brugbart and our partners.

Learn more

CSS Font-size Property

Reference on the CSS Font-size Property. Includes useful Example of how its used.

Edited: 2016-01-18 05:34

The CSS font-size property controls the size of text.

In the past, it has been widely recommended to use relative length units, rather than fixed pixel units for font-sizes. This was because using the pixel unit would "lock" the font-size from being re-sized, creating accessibility issues for some users. Today most modern browsers typically allow users to zoom, so the initial font-size on a web page has become less important.

For most text-heavy sites using a relative length unit, such as em, might still be a better choice than using pixels. This is simply because zooming is an inconvenience to users. Using Media Queries will eliminate these problems, regardless of whether you are using fixed or relative length units in your designs.

Tip. Since the font-size value is inherited, setting it once on a parent element such as body or a div will make all child elements inherit the value from the parent.

Possible Values

Read Units of Measurement to understand the values. It is recommended to use EM or Percentages when setting the font-size. Example:

p {
  /* Using Ems */
  font-size: 1em;
  /* Using Percentages */
  font-size: 100%;
  /* Using Pixels */
  font-size: 18px;
}

Inherited? - YES!