CSS Font Size
An element inherits its parent's font size by default.
This behavior can be overridden by using the font-size property, which sets the font size for the element.
Recall that the document has a base font size - usually 16px. The value of font size not only controls the size of the text but also determines base sizing for anything specified in em or other relative units.
The em unit is not just for text, but the Borders, padding, and even width and height can all be specified in ems.
In addition, there are several predefined font-size values, ranging from xx-small to xxx-large.
Relative font size can also be specified, with a value of smaller or larger.
Font size can also be specified as a percentage of its parent's size.
Syntax -
Now we will see Examples -
Example 1 -
Using em units on the parent and child
Output -
The parent and child have different font sizes.
Example 2 - this can be said a standard example -
Output -
As we saw all the three headings are of different sizes.
Note -
We do not recommend using
tag with more font size in the places of heading because it affects the search engine optimization.
|
