<relative-size>
The <relative-size>
CSS data type describes relative size keywords. The <relative-size>
keywords define a size relative to the computed size of the parent element. This data type is used in the font
shorthand and font-size
properties.
Syntax
<relative-size> = smaller | larger
Values
Description
The <relative-size>
keywords are relative to the current size of the element. If the inherited size is defined using an <absolute-size>
keyword, the <relative-size>
value equates to the adjacent size in the <absolute-size>
table. Otherwise, the relative increase or decrease in size is between 120% and 150%.
Examples
Comparing the keyword values
html
<ul>
<li class="smaller">font-size: smaller;</li>
<li>font-size is not specified</li>
<li class="larger">font-size: larger;</li>
</ul>
css
li {
margin-bottom: 0.3em;
}
.smaller {
font-size: smaller;
}
.larger {
font-size: larger;
}
Result
Specifications
Specification |
---|
CSS Fonts Module Level 4 # valdef-font-size-relative-size |
See also
- CSS
<absolute-size>
data type - CSS
font
andfont-size
properties - CSS fonts module