The <tr> element creates a row in a table. Rows are used to organize data into horizontal lines before you add the actual data or headings.
<table> <tr> <!-- Row content here --> </tr> </table>
The <td> element is used to add a cell of data inside a row. Each <td> represents a single piece of information in that row.
<table> <tr> <td>Data 1</td> <td>Data 2</td> </tr> </table>
The <thead> element is used to define the header section of a table. It groups header rows that describe the columns of your table.
<table> <thead> <tr> <th>Header 1</th> <th>Header 2</th> </tr> </thead> <tbody> <tr> <td>Row 1, Col 1</td> <td>Row 1, Col 2</td> </tr> </tbody> </table>
The rowspan attribute allows a cell to extend across multiple rows. For example, if you want a cell to cover two rows, you can set rowspan="2".
<table> <tr> <th>Row 1</th> <td>Cell 1</td> <td>Cell 2</td> </tr> <tr> <th rowspan="2">Row 2 (spans 2 rows)</th> <td>Cell 1</td> <td>Cell 2</td> </tr> <tr> <td>Cell 1</td> <td>Cell 2</td> </tr> <tr> <th>Row 3</th> <td>Cell 1</td> <td>Cell 2</td> </tr> </table>
The <tbody> element wraps around all the rows in the main part of the table, separating them from the header and footer sections. It's used to group the body rows together.
<table> <tbody> <tr> <td>Row 1</td> </tr> <tr> <td>Row 2</td> </tr> <tr> <td>Row 3</td> </tr> </tbody> </table>
The <th> element is used to create a heading cell in a table, which usually contains text that describes the contents of a column or row. It should be placed inside a <tr> element.
<table> <tr> <th>Column 1</th> <th>Column 2</th> </tr> <tr> <td>1</td> <td>2</td> </tr> </table>
The colspan attribute allows a cell to span across multiple columns. For example, setting colspan="2" will make the cell cover two columns.
<table> <tr> <th>Row 1</th> <td>Cell 1</td> <td>Cell 2</td> <td>Cell 3</td> </tr> <tr> <th>Row 2</th> <td colspan="2">Cell 1 (spans 2 columns)</td> <td>Cell 3</td> </tr> </table>
The <tfoot> element is used to create a footer for a table. It can contain summary information or other concluding data related to the table's content.
<table> <thead> <tr> <th>Header 1</th> <th>Header 2</th> </tr> </thead> <tbody> <tr> <td>Row 1, Col 1</td> <td>Row 1, Col 2</td> </tr> </tbody> <tfoot> <tr> <td>Footer summary for Col 1</td> <td>Footer summary for Col 2</td> </tr> </tfoot> </table>
The <table> element is the container for all the table content, including rows, columns, headings, and footers.
<table> <!-- Add rows and columns here --> </table>
Welcome to our comprehensive collection of programming language cheatsheets! Whether you're a seasoned developer or a beginner, these quick reference guides provide essential tips and key information for all major languages. They focus on core concepts, commands, and functions—designed to enhance your efficiency and productivity.
ManageEngine Site24x7, a leading IT monitoring and observability platform, is committed to equipping developers and IT professionals with the tools and insights needed to excel in their fields.
Monitor your IT infrastructure effortlessly with Site24x7 and get comprehensive insights and ensure smooth operations with 24/7 monitoring.
Sign up now!