CSS Font Properties
Computed value
of font-size
property
CSS Font Properties
Reference font defines em and ex units
◼ Normally, reference font is the font of the
element being styled
◼ Exception: Using em/ex to specify value for
font-size
parent element’s font is
reference font
CSS Font Properties
Other ways to specify value for
font-size:
◼ Percentage (of parent font-size)
◼ Absolute size keyword: xx-small, x-small,
small, medium (initial value), large,
x-large, xx-large
⚫ User agent specific; should differ by ~ 20%
◼ Relative size keyword: smaller, larger
⚫ Relative to parent element’s font
CSS Font Properties
CSS Font Properties
Text is rendered using line boxes
Height of line box given by line-height
◼ Initial value: normal (i.e., cell height; relationship with
em height is font-specific)
◼ Other values (following are equivalent):
CSS Font Properties
When line-height is greater than cell
height:
Inheritance of line-height:
◼ Specified value if normal or unit-less number
◼ Computed value otherwise
CSS Font Properties
font shortcut property:
Guy-Vincent Jourdan :: CSI 3140 :: based on Jeffrey C. Jackson’s slides
CSS Font Properties
font shortcut property:
Initial values used if no value specified in font
property list (that is, potentially reset)
CSS Font Properties
font shortcut property:
specifying line-height (here, twice cell height)
any order size and family required,
order-dependent
CSS Text Formatting
Guy-Vincent Jourdan :: CSI 3140 :: based on Jeffrey C. Jackson’s slides
CSS Text Color
Font color specified by color property
Two primary ways of specifying colors:
◼ Color name: black, gray, silver, white, red, lime,
blue, yellow, aqua, fuchsia, maroon, green, navy,
olive, teal, purple, full list at
[Link]
Keywords
◼ red/green/blue (RGB) values
CSS Text Color