<!--
{
  "documentType" : "article",
  "framework" : "AppleNewsFormat",
  "identifier" : "/documentation/AppleNews/adding-an-html-table",
  "metadataVersion" : "0.1.0",
  "role" : "article",
  "title" : "Adding an HTML Table"
}
-->

# Adding an HTML Table

Add a table formatted in HTML to your article.

## Discussion

To add an HTML table to your article, you add a component with the `role` property set to `htmltable`. In the required `html` property, add the coded HTML table consisting of your data and the HTML tags that indicate rows. Make sure that all of your HTML code is enclosed in `<table> </table>` tags.

To change the appearance of an HTML table, you can use any of the HTML tags Apple News Format supports; for more information, see <doc://com.apple.applenews/documentation/AppleNews/using-html-with-apple-news-format>. You can also apply c`omponentStyles` from Apple News Format; for more information, see [`TableStyle`](/documentation/AppleNewsFormat/TableStyle).

### Review the HTML Table Tags

Apple News Format supports these tags for HTML tables:

```html
	<table> </table>

	<th> </th>

	<tr> </tr>

	<td> </td>

	<thead> </thead>

	<tbody> </tbody>

	<tfoot> </tfoot>

	<caption> </caption>
```

> Note: HTML `<th>` or `<td>` elements that span multiple columns or rows aren’t supported. Apple News Format ignores `colspan` and `rowspan` attributes.

This list describes how to use the basic HTML table tags:

- Begin each row of the table (including the header row) with `<tr>` and end each row with `</tr>`.
- Use table heading tags (`<th>` and `</th>`) around each element in the table header.
- Put table data tags (`<td>` and `</td>`) around each element in a row.
- Enclose a  single row or group of rows in `<thead>`, `<tbody>`, or `<tfoot>` tags.
- Style your table text using supported HTML tags. See <doc://com.apple.applenews/documentation/AppleNews/using-html-with-apple-news-format>.
- Use a JSON [`ComponentStyle`](/documentation/AppleNewsFormat/ComponentStyle) that has the `tableStyle` object defined to specify table alignment, table padding, and other, nontextual table styles. Apple News Format ignores any style-related HTML attributes, such as `cellpadding`, `cellspacing`, `width`, and `alignment`.

Consider the following example HTML code:

```html
<table><tr><th>First Name</th><th>Last Name</th></tr>
<tr><td>John</td><td>Appleseed</td></tr></table>
```

This code results in a table with two columns and two rows — one row is for the heading and one is for data.

|First name|Last name|
|----------|---------|
|John      |Appleseed|

---

Copyright &copy; 2026 Apple Inc. All rights reserved. | [Terms of Use](https://www.apple.com/legal/internet-services/terms/site.html) | [Privacy Policy](https://www.apple.com/privacy/privacy-policy)