Style font attribute

Definition and Usage

font Properties are set or returned in abbreviated form, covering up to six separate font properties.

Through this property, you can set/return the following content (in this order):

font-size and font-family Is required. If any other value is missing, the default value (if any) will be inserted.

The above properties can also be set using separate style properties. It is strongly recommended that non-advanced authors use separate properties for better controlability.

See also:

CSS Tutorial:CSS Font

CSS Reference Manual:font attribute

Instance

Example 1

Set the font of the <p> element:

document.getElementById("myP").style.font = "italic bold 20px arial,serif";

Try it yourself

Example 2

Return the font of the <p> element:

alert(document.getElementById("myP").style.font);

Try it yourself

Syntax

Return font attribute:

object.style.font

Set font attribute:

object.style.font = "font-style font-variant font-weight font-size/line-height|caption|icon|menu|
message-box|small-caption|status-bar|initial|inherit;"

Attribute value

Value Description
style Set font style.
variant Set text to small caps.
weight Set the thickness of the font.
size Set font size.
lineHeight Set line spacing.
family Set font.
caption Font used for title controls (such as buttons, dropdown menus, etc.).
icon Font used for marking icons.
menu Font used in menus.
message-box Font used in dialog boxes.
small-caption Font used in small controls.
status-bar Font used in the window status bar.
initial Set this property to its default value. See initial.
inherit Inherit this property from its parent element. See inherit.

Technical details

Default value: Not specified
Return value: A string representing the different font properties of the element.
CSS version: CSS1

Browser support

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Supported Supported Supported Supported Supported