Variants and Examples Office List Office Country Employees Contact Austin, TX United States 48 Henna Ferry Bangalore India 13 Arun Chadda New York City, NY United States 22 Billy Bourne San Francisco, CA United States 108 Shane Holmes San Ramon, CA United States 18 Annie Wu Vancouver, BC Canada 76 Kendal Lewis
< tableclass = " d-table dialtone-doc-table" > < captionclass = " d-table__caption" > </ caption> < thead> < tr> < thscope = " col" > </ th> < thscope = " col" > </ th> < thscope = " col" width = " 10%" > </ th> < thscope = " col" > </ th> </ tr> </ thead> < tbody> < trv-for = " i in examples" > < thscope = " row" > </ th> < td> </ td> < td> </ td> < td> </ td> </ tr> </ tbody> </ table>
Raw HTML renders visuals only. You may need to add JS to replicate its functionality.
Office List Office Country Employees Contact Austin, TX United States 48 Henna Ferry Bangalore India 13 Arun Chadda New York City, NY United States 22 Billy Bourne San Francisco, CA United States 108 Shane Holmes San Ramon, CA United States 18 Annie Wu Vancouver, BC Canada 76 Kendal Lewis
< tableclass = " d-table dialtone-doc-table d-table--striped" > < captionclass = " d-table__caption" > </ caption> < thead> < tr> < thscope = " col" > </ th> < thscope = " col" > </ th> < thscope = " col" width = " 10%" > </ th> < thscope = " col" > </ th> </ tr> </ thead> < tbody> < trv-for = " i in examples" > < thscope = " row" > </ th> < td> </ td> < td> </ td> < td> </ td> </ tr> </ tbody> </ table>
Raw HTML renders visuals only. You may need to add JS to replicate its functionality.
Use the caption element to describe a table in the same way you would use a heading. A caption helps users find, navigate and understand tables.
We provide .d-table__caption for a basic caption style, but you can also use utility classes to apply custom styles as needed.