| <!DOCTYPE html> |
| <title>Test for font-display @font-face descriptor</title> |
| <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> |
| <style> |
| .ahem { |
| font-family: Ahem; |
| } |
| .arial { |
| font-family: Arial; |
| } |
| </style> |
| <p>Tests how text with a font that takes <i>delay</i> seconds to load look like after <i>T</i> seconds from load start.</p> |
| <table> |
| <tr> |
| <th>T[sec]</th> |
| <th>delay[sec]</th> |
| <th>block</th> |
| <th>swap</th> |
| <th>fallback</th> |
| <th>optional</th> |
| </tr> |
| <tr> |
| <td>0</td> |
| <td>1</td> |
| <td></td> |
| <td class="arial">a</td> |
| <td></td> |
| <td class="arial">a</td> |
| </tr> |
| <tr> |
| <td>1</td> |
| <td>0</td> |
| <td class="ahem">a</td> |
| <td class="ahem">a</td> |
| <td class="ahem">a</td> |
| <td class="ahem">a</td> |
| </tr> |
| <tr> |
| <td>1</td> |
| <td>0.5</td> |
| <td class="ahem">a</td> |
| <td class="ahem">a</td> |
| <td class="ahem">a</td> |
| <td class="arial">a</td> |
| </tr> |
| <tr> |
| <td>1</td> |
| <td>3</td> |
| <td></td> |
| <td class="arial">a</td> |
| <td class="arial">a</td> |
| <td class="arial">a</td> |
| </tr> |
| <tr> |
| <td>5</td> |
| <td>2</td> |
| <td class="ahem">a</td> |
| <td class="ahem">a</td> |
| <td class="ahem">a</td> |
| <td class="arial">a</td> |
| </tr> |
| <tr> |
| <td>5</td> |
| <td>4</td> |
| <td class="ahem">a</td> |
| <td class="ahem">a</td> |
| <td class="arial">a</td> |
| <td class="arial">a</td> |
| </tr> |
| <tr> |
| <td>5</td> |
| <td>8</td> |
| <td class="arial">a</td> |
| <td class="arial">a</td> |
| <td class="arial">a</td> |
| <td class="arial">a</td> |
| </tr> |
| </table> |