Alright, so I wanted to mess around with creating tables in HTML, you know, just for displaying data in a neat way. I’ve seen them everywhere, but never really built one from scratch myself. Figured it was time to give it a shot!
Getting Started
First things first, I needed a basic HTML structure. I just whipped up a simple HTML file with the usual <html>, <head>, and <body> tags. Nothing fancy, just the bare bones to get started.
Building the Table
Then came the actual table part. I learned that you start with the <table> tag. That’s like the container for the whole thing. Inside that, you gotta define rows using the <tr> tag. “tr” stands for “table row,” makes sense, right?
- <table>: The main container.
- <tr>: Each row in the table.
Now, within each row, you have cells. These can be either headings or regular data cells. For headings, you use <th> (table header), and for regular data, you use <td> (table data). I decided to make a simple table with some names and ages, so I started with a header row.
I added a <tr>, and inside that, I put in a couple of <th> tags: one for “Name” and one for “Age”.
Adding the Data
Next up, I needed to add the actual data rows. I created a new <tr> for each person. Inside each of these rows, I used <td> tags to put in the name and age. So, like, one <td> for “John” and another <td> for “30”, all within the same <tr>.
I did the same for a few more people, each in their own <tr> with their name and age in <td> tags.
Seeing the Results
Finally, I saved the file and opened it in my browser. And there it was! A basic, but functional, HTML table. It wasn’t super pretty, but it displayed the data in rows and columns, just like I wanted. I can style it later with some CSS, but I wanted to get the basic Table structure done firstly.
It was a pretty simple process, really. Just a bunch of nested tags, but once you get the hang of it, it’s not too bad. I feel like I’ve got a decent grasp on the basics of HTML tables now. Definitely gonna play around with this more!
