Type

<div class="f:0">font-size 0</div>
<div class="f:.1">font-size .1</div>
<div class="f:.2">font-size .2</div>
<div class="f:.3">font-size .3</div>
<div class="f:.4">font-size .4</div>
<div class="f:.5">font-size .5</div>
<div class="f:.6">font-size .6</div>
<div class="f:.7">font-size .7</div>
<div class="f:.8">font-size .8</div>
<div class="f:.9">font-size .9</div>
<div class="f:1">font-size 1 base size</div>
<div class="f:2">font-size 2</div>
<div class="f:3">font-size 3</div>
<div class="f:4">font-size 4</div>
<div class="f:5">font-size 5</div>
<div class="f:6">font-size 6</div>
<div class="f:7">font-size 7</div>
<div class="f:8">font-size 8</div>
<div class="f:9">font-size 9</div>
<div class="f:10">font-size 10</div>

<div class="f-w:100">font-weight: 100</div>
<div class="f-w:200">font-weight: 200</div>
<div class="f-w:300">font-weight: 300</div>
<div class="f-w:400">font-weight: 400</div>
<div class="f-w:500">font-weight: 500</div>
<div class="f-w:600">font-weight: 600</div>
<div class="f-w:700">font-weight: 700</div>
<div class="f-w:800">font-weight: 800</div>
<div class="f-w:900">font-weight: 900</div>

<div class="f-s:n">font-style: normal</div>
<div class="f-s:i">font-style: italic</div>
<div class="f-s:o">font-style: oblique</div>

<div class="f-f:sans">font-family: sans</div>
<div class="f-f:serif">font-family: serif</div>
<div class="f-f:mono">font-family: mono</div>

<div class="l-h:d">line-height: default</div>
<div class="l-h:t">line-height: tight</div>
<div class="l-h:n">line-height: normal</div>
<div class="l-h:l">line-height: loose</div>

<div class="l-s:d">letter-spacing: default</div>
<div class="l-s:t">letter-spacing: tight</div>
<div class="l-s:n">letter-spacing: normal</div>
<div class="l-s:l">letter-spacing: loose</div>

<div class="t-d:n">text-decoration: none</div>
<div class="t-d:u">text-decoration: underline</div>
<div class="t-d:l-t">text-decoration: line-through</div>

<div class="hover/t-d:n">hover / text-decoration: none</div>
<div class="hover/t-d:u">hover / text-decoration: underline</div>
<div class="hover/t-d:l-t">hover / text-decoration: line-through</div>

<div class="focus/t-d:n">focus / text-decoration: none</div>
<div class="focus/t-d:u">focus / text-decoration: underline</div>
<div class="focus/t-d:l-t">focus / text-decoration: line-through</div>

<div class="active/t-d:n">active / text-decoration: none</div>
<div class="active/t-d:u">active / text-decoration: underline</div>
<div class="active/t-d:l-t">active / text-decoration: line-through</div>

<div class="visited/t-d:n">visited / text-decoration: none</div>
<div class="visited/t-d:u">visited / text-decoration: underline</div>
<div class="visited/t-d:l-t">visited / text-decoration: line-through</div>

<div class="t-t:n">text-transform: none</div>
<div class="t-t:u">text-transform: uppercase</div>
<div class="t-t:l">text-transform: lowercase</div>
<div class="t-t:c">text-transform: capitalize</div>

<div class="t-a:c">text-align: center</div>
<div class="t-a:l">text-align: left</div>
<div class="t-a:r">text-align: right</div>
<div class="t-a:j">text-align: justify</div>