| <DOCTYPE html> |
| <style> |
| .chancery { |
| font-family: "Apple Chancery", fantasy; |
| } |
| |
| .system { |
| font-family: system-ui, fantasy;; |
| } |
| |
| .baskerville { |
| font-family: "Baskerville", fantasy; |
| } |
| |
| .fake_small_caps { |
| text-transform: uppercase; |
| font-size: 70%; |
| margin-bottom: 10px; |
| } |
| |
| .small_caps { |
| font-variant-caps: small-caps; |
| } |
| |
| </style> |
| <div>For each pair of lines, the first line should have different glyph shapes to the second, i.e. real small-caps |
| should be used in each of the pairs' first line.</div> |
| <div class="chancery small_caps">Apple Chancery Real Small Caps wwaammii</div> |
| <div class="chancery fake_small_caps">Apple Chancery Fake Small Caps wwaammii</div> |
| <div class="system small_caps">San Francisco Real Small Caps wwaammii</div> |
| <div class="system fake_small_caps">San Francisco Fake Small Caps wwaammii</div> |
| <div class="baskerville small_caps">Baskerville Real Small Caps wwaammii</div> |
| <div class="baskerville fake_small_caps">Baskerville Fake Small Caps wwaammii</div> |
