type styling

Miles Lee / Interaction Foundations / Type Styling Demonstration

This page demonstrates type styling with CSS. It is set in Ubuntu.
The sample text is taken from the OED's definition of the word "misguggle" (thanks to Alana Korol for the inspiration).

font weight

font-weight: normal;

I'll misguggle your thrapple. I'll mashackerel ye to rights.

font-weight: bold;

font style

font-style: normal;

I'll misguggle your thrapple. I'll mashackerel ye to rights.

font-style: italic; font-style: oblique;

letter spacing

letter-spacing: none;

I'll misguggle your thrapple. I'll mashackerel ye to rights.

letter-spacing: 5px; letter-spacing: -2px;

text transform

text-transform: none;

I'll misguggle your thrapple. I'll mashackerel ye to rights.

text-transform: uppercase; text-transform: lowercase; text-transform: capitalize;

text decoration

text-decoration: none;

I'll misguggle your thrapple. I'll mashackerel ye to rights.

text-decoration: underline; text-decoration: line-through; text-decoration: overline; text-decoration: overline; text-decoration-style: wavy;