Sizing


Premium Content - Free Preview

Text size keywords

Earlier we set the font-size of text to large. This is an keyword that tells the browser to set an absolute size. Click below for the other available keywords:

Text Size Keywords

You can also use relative keywords, which will set the font-size relative to the size of the parent element:

  • larger
  • smaller

Here's an example:

I travelled for 1 million inches (or 96 million pixels) until I reached the CSS guru. I quietly asked him "How should I size my CSS?". He replied You should generally use relative sizing!
<blockquote style="font-size: large">I travelled for 1 million inches (or 96 million pixels) until I reached the CSS guru. I quietly asked him <span style="font-size: small">"How should I size my CSS?"</span>. He replied <i style="font-size: smaller">You should generally use relative sizing!</i></blockquote>

Note how the CSS guru's reply becomes size medium, one size smaller than the size of the parent element blockquote.

More Exact Sizing

It's fine to use keywords to set the default font-size for certain elements, such as the body element. Often, you'll want more control when setting the size of other elements. CSS lets you set the size very precisely with both absolute units and relative units.

absolute sizes
You can set the font-size using an absolute measure such as px (for pixels), but this is usually not recommended, since the screen's size and proportions can very greatly. You can also useinfor inches, among other measurements. In CSS, oneinis 96px`, not an actual inch.


End of Free Content Preview. Please Sign in or Sign up to buy premium content.

Contact Us