Easy Tutorial
❮ Pr Grid Row End Css3 Pr Animation Play State ❯

CSS font-size Property

Example

Set different font sizes for various HTML elements:

h1 {font-size:250%}
h2 {font-size:200%}
p {font-size:100%}

Property Definition and Usage

The font-size property is used to set the size of the font.

Default value: medium
Inherited: yes
--- ---
Version: CSS1
--- ---
JavaScript syntax: object.style.fontSize="larger"
--- ---
/* <absolute-size>, absolute size values */
font-size: xx-small;
font-size: x-small;
font-size: small;
font-size: medium;
font-size: large;
font-size: x-large;
font-size: xx-large;

/* <relative-size>, relative size values */
font-size: larger;
font-size: smaller;

/* <length>, length values */
font-size: 12px;
font-size: 0.8em;

/* <percentage>, percentage values */
font-size: 80%;

font-size: inherit;

Browser Support

The numbers in the table specify the first browser version that fully supports the property.

Property
font-size 1.0 5.5 1.0 1.0 7.0

Property Values

Value Description
xx-small<br>x-small<br>small<br>medium<br>large<br>x-large<br>xx-large Sets the font size to different sizes from xx-small to xx-large. Default value: medium.
smaller Sets the font size to a smaller size than the parent element.
larger Sets the font size to a larger size than the parent element.
length Sets the font size to a fixed value.
% Sets the font size to a percentage of the parent element's font size.
inherit Specifies that the font size should be inherited from the parent element.

Related Articles

CSS Tutorial: CSS Font

CSS Reference Manual: font Property

❮ Pr Grid Row End Css3 Pr Animation Play State ❯