font-size
The font-size CSS property sets the text height.
Overview
The font-size CSS property sets the text height.
Browser support
| Feature | Desktop | Mobile | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
| 1 | 12 | 1 | 1 | 18 | 1 | |
rem values `rem` values | 31 | 12 | 31 | 7 | 42 | 7 |
xxx-large `xxx-large` keyword | 79 | 79 | 70 | 16.4 | 79 | 16.4 |
| Other | ||||||
| The font-size attribute refers to the size of the font from baseline/typography to baseline when multiple lines of text are set solid in a multiline layout environment. | 1 | 12 | 1 | 1 | 18 | 1 |
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)
Notes 2 item(s)
Implementation note
- Before Firefox 57, animations using em units are not affected by changes to the `font-size` of the animated element's parent (bug 1254424).
- Before Firefox 57, some language settings' inherited `font-size` is smaller than expected (bug 1391341).
Syntax
CSS
html { font-size: 16px; }
body { font-size: 1rem; }
h1 { font-size: 2.5rem; }
small { font-size: 0.875rem; }Live demo
Use cases
Using font-size
The font-size CSS property sets the text height.
Cautions
- May not be supported in older browsers.
Accessibility
- Make sure visual changes are conveyed appropriately to assistive technology.
Related links
Powered by web-features