See this CSS Tutorial that shows how to use the font-size property, font size, relative units such as pixel and percent, and absolute, such as point and centimeters.
The font-size property is used to indicate font size in CSS. This site can be specified in several units of measurement. Usually, the units of measure are relative, such as pixel and percentage, and absolute, such as point and centimeters.
Make your WordPress site’s Load Blazing Fast Just by moving to Nestify. Migrate your WooCommerce Store or WordPress Website NOW.
Good site planning is vital for the font-size property to be applied correctly and without wastage, i.e., it is not necessary to use font size for all text tags.
Possible measures for the font-size are:
- xx-small (equals 9px)
- x-small (equals 10px)
- small (equals 13px)
- medium (equals 16px)
- large (equals 18px)
- x-large (equals 24px)
- xx-large (equals 32px)
- smaller (equals 13px)
- larger (equals 18px)
You can still use custom values to determine letter size, which may be in several units of measure.
Relative unit
pixel (px)
The pixel width is proportional to the device we are using, monitor, screen, mobile device screen, etc.
ems
Determines how many times you should increase font size relative to the size of the parent element. For example:
body {
font-size: 20px;
}
h1 {
1.5em;
}
The font size in h1 will be 30px, increasing one and a half times the font size of the parent element in our example, the body tag.
Percentage (%)
Determines that the letter size will be a percentage relative to the parent element. Let’s see a practical example below.
p {
font-size: 20px;
}
span {
200%;
}
The size of the letter in the span will be 40px because it is 200% above the font size of the parent element that, here in our example, is the p tag.
Absolute unit
- points – points (en)
- in (in)
- centimeters (cm)
- millimeters (mm)
- picas
These measures are not very common for use on the web, and their application is more common for print media such as newspapers, magazines, and outdoor, among others. To use these measures, use the master rule of a relative, applying only the appropriate value and the measure itself.
- font-size: 28pt;
- font-size: 2cm;
- font-size: 10in;
- font-size: 40mm;
- font-size: 3pc;
