CSS font Property
Description
The font property is shorthand that allows you to do one of two things: you can either set up six of the most mature font properties in one line, or you can set one of a choice of keywords to adopt a system font setting.
- Initial value
- See individual properties
- Applies to
- All elements
- Inherited
- Yes
- Media
- Visual
- Computed value
- See individual properties
- Animatable
- See individual properties
- CSS Version
- CSS1, CSS2, CSS3
- JavaScript syntax
- object.style.font
Syntax
Formal syntax: [ [ <font-style> || <font-variant> || <font-weight> || <font-stretch> ]? <font-size> [ / <line-height> ]? <font-family> ] | caption | icon | menu | message-box | small-caption | status-bar
Values
- <font-style>See the font-style CSS property for values.
- <font-variant>See the font-variant CSS property for values.
- <font-weight>See the font-weight CSS property for values.
- <font-size>See the font-size CSS property for values.
- <font-family>See the font-family CSS property for values.
Example
body {
font: bold .9em sans-serif;
}Give it a Try
Click the button below to experiment with this property.
Browser Support
| Desktop | |||||
 |
 |
 |
 |
 |
 |
| 3 | 12 | 1 | 1 | 3.5 | 1 |
| Tablets / Mobile | |||||
 |
|
|
|
|
 |
| ≤37 | 18 | 4 | Yes | 1 | Yes |