pandoc/test/tables.html5
John MacFarlane 7a9832166e Add text wrapping to HTML output.
Previously the HTML writer was exceptional in not being
sensitive to the `--wrap` option.  With this change `--wrap`
now works for HTML. The default (as with other formats) is
automatic wrapping to 72 columns.

A new internal module, T.P.Writers.Blaze, exports `layoutMarkup`.
This converts a blaze Html structure into a doclayout Doc Text.

In addition, we now add a line break between an `img` tag
and the associated `figcaption`.

Note: Output is never wrapped in `writeHtmlStringForEPUB`.
This accords with previous behavior since previously the HTML
writer was insensitive to `--wrap` settings.  There's no real
need to wrap HTML inside a zipped container.

Note that the contents of script, textarea, and pre tags are
always laid out with the `flush` combinator, so that unwanted
spaces won't be introduced if these occur in an indented context
in a template.

Closes #7764.
2021-12-22 09:45:02 -08:00

206 lines
5.3 KiB
Text
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<p>Simple table with caption:</p>
<table>
<caption>Demonstration of simple table syntax.</caption>
<thead>
<tr class="header">
<th style="text-align: right;">Right</th>
<th style="text-align: left;">Left</th>
<th style="text-align: center;">Center</th>
<th>Default</th>
</tr>
</thead>
<tbody>
<tr class="odd">
<td style="text-align: right;">12</td>
<td style="text-align: left;">12</td>
<td style="text-align: center;">12</td>
<td>12</td>
</tr>
<tr class="even">
<td style="text-align: right;">123</td>
<td style="text-align: left;">123</td>
<td style="text-align: center;">123</td>
<td>123</td>
</tr>
<tr class="odd">
<td style="text-align: right;">1</td>
<td style="text-align: left;">1</td>
<td style="text-align: center;">1</td>
<td>1</td>
</tr>
</tbody>
</table>
<p>Simple table without caption:</p>
<table>
<thead>
<tr class="header">
<th style="text-align: right;">Right</th>
<th style="text-align: left;">Left</th>
<th style="text-align: center;">Center</th>
<th>Default</th>
</tr>
</thead>
<tbody>
<tr class="odd">
<td style="text-align: right;">12</td>
<td style="text-align: left;">12</td>
<td style="text-align: center;">12</td>
<td>12</td>
</tr>
<tr class="even">
<td style="text-align: right;">123</td>
<td style="text-align: left;">123</td>
<td style="text-align: center;">123</td>
<td>123</td>
</tr>
<tr class="odd">
<td style="text-align: right;">1</td>
<td style="text-align: left;">1</td>
<td style="text-align: center;">1</td>
<td>1</td>
</tr>
</tbody>
</table>
<p>Simple table indented two spaces:</p>
<table>
<caption>Demonstration of simple table syntax.</caption>
<thead>
<tr class="header">
<th style="text-align: right;">Right</th>
<th style="text-align: left;">Left</th>
<th style="text-align: center;">Center</th>
<th>Default</th>
</tr>
</thead>
<tbody>
<tr class="odd">
<td style="text-align: right;">12</td>
<td style="text-align: left;">12</td>
<td style="text-align: center;">12</td>
<td>12</td>
</tr>
<tr class="even">
<td style="text-align: right;">123</td>
<td style="text-align: left;">123</td>
<td style="text-align: center;">123</td>
<td>123</td>
</tr>
<tr class="odd">
<td style="text-align: right;">1</td>
<td style="text-align: left;">1</td>
<td style="text-align: center;">1</td>
<td>1</td>
</tr>
</tbody>
</table>
<p>Multiline table with caption:</p>
<table style="width:80%;">
<caption>Heres the caption. It may span multiple lines.</caption>
<colgroup>
<col style="width: 15%" />
<col style="width: 13%" />
<col style="width: 16%" />
<col style="width: 35%" />
</colgroup>
<thead>
<tr class="header">
<th style="text-align: center;">Centered Header</th>
<th style="text-align: left;">Left Aligned</th>
<th style="text-align: right;">Right Aligned</th>
<th style="text-align: left;">Default aligned</th>
</tr>
</thead>
<tbody>
<tr class="odd">
<td style="text-align: center;">First</td>
<td style="text-align: left;">row</td>
<td style="text-align: right;">12.0</td>
<td style="text-align: left;">Example of a row that spans multiple lines.</td>
</tr>
<tr class="even">
<td style="text-align: center;">Second</td>
<td style="text-align: left;">row</td>
<td style="text-align: right;">5.0</td>
<td style="text-align: left;">Heres another one. Note the blank line between
rows.</td>
</tr>
</tbody>
</table>
<p>Multiline table without caption:</p>
<table style="width:80%;">
<colgroup>
<col style="width: 15%" />
<col style="width: 13%" />
<col style="width: 16%" />
<col style="width: 35%" />
</colgroup>
<thead>
<tr class="header">
<th style="text-align: center;">Centered Header</th>
<th style="text-align: left;">Left Aligned</th>
<th style="text-align: right;">Right Aligned</th>
<th style="text-align: left;">Default aligned</th>
</tr>
</thead>
<tbody>
<tr class="odd">
<td style="text-align: center;">First</td>
<td style="text-align: left;">row</td>
<td style="text-align: right;">12.0</td>
<td style="text-align: left;">Example of a row that spans multiple lines.</td>
</tr>
<tr class="even">
<td style="text-align: center;">Second</td>
<td style="text-align: left;">row</td>
<td style="text-align: right;">5.0</td>
<td style="text-align: left;">Heres another one. Note the blank line between
rows.</td>
</tr>
</tbody>
</table>
<p>Table without column headers:</p>
<table>
<tbody>
<tr class="odd">
<td style="text-align: right;">12</td>
<td style="text-align: left;">12</td>
<td style="text-align: center;">12</td>
<td style="text-align: right;">12</td>
</tr>
<tr class="even">
<td style="text-align: right;">123</td>
<td style="text-align: left;">123</td>
<td style="text-align: center;">123</td>
<td style="text-align: right;">123</td>
</tr>
<tr class="odd">
<td style="text-align: right;">1</td>
<td style="text-align: left;">1</td>
<td style="text-align: center;">1</td>
<td style="text-align: right;">1</td>
</tr>
</tbody>
</table>
<p>Multiline table without column headers:</p>
<table style="width:80%;">
<colgroup>
<col style="width: 15%" />
<col style="width: 13%" />
<col style="width: 16%" />
<col style="width: 35%" />
</colgroup>
<tbody>
<tr class="odd">
<td style="text-align: center;">First</td>
<td style="text-align: left;">row</td>
<td style="text-align: right;">12.0</td>
<td>Example of a row that spans multiple lines.</td>
</tr>
<tr class="even">
<td style="text-align: center;">Second</td>
<td style="text-align: left;">row</td>
<td style="text-align: right;">5.0</td>
<td>Heres another one. Note the blank line between rows.</td>
</tr>
</tbody>
</table>