If the property is inherited, then you know that the value will remain the same for every child element in the document. We will understand the usage of the font-family property by implementing it.Įxample: This example illustrates the use of the font-family property. The easiest way to use it is to become familiar with the CSS properties that are and are not inherited. Note: The font-name can be declared with the single quotes when using the style attribute in the HTML & also it must be quoted when it contains white space. inherit: It is used to inherit a property to an element from its parent element property value.Only a few CSS properties can be inherited from ancestors. initial: It is used to set an element’s CSS property to its default value. All child and descendant elements will inherit the value grey from their common ancestor body, which naturally encompasses all elements.generic-family: It is used to set the font of text in an HTML document from the list of available fonts from the font pool.fonts-name: This specifies the name of the font in quotes separated by commas.generic-family: It contains name of a generic-family, such as”serif”, “sans-serif”, “cursive”, “fantasy”, “monospace”.įont-family: family-name|generic-family|initial|inherit.family-name: It contains the name of a font-family, such as “times”, “courier”, “arial”, etc.The font-family can be categorized into 2 types:
In other words, this property is used to specifies the family-name &/or generic-family, based on the priority from the list, for the selected element. if the browser doesn’t support one font then the other can be used. It can have multiple fonts as a backup system i.e.
The font-family property specifies the font of an element.
Css inherit font family how to#
How to find out the font-family in chrome developer pane Beautify Your.