How to Make Rows & Columns Visible Using HTML

When you want to arrange webpage content into neat rows and columns, the easiest method is to use the table tags in HTML code, which stands for HyperText Markup Language. Once you have built the structure of the table and added text or images to the different rows and columns, you can customize the borders of the table to make those rows and columns visible.

Difficulty: Moderate

Instructions

Things You'll Need:

• Active web server Web editing application

1. Open a new blank document in your web editing application. Professional web designers use programs like Adobe Dreamweaver, but you can write HTML code in a basic word processor as well.

2. Type "<table> </table" into the body of your HTML code. These table tags notify the web browser that you are going to be working with rows and columns on this page.

3. Type "<tr> </tr>" in between the "table" tags from Step 2 to create a new row in your table. Repeat this step for as many rows as you want to create.

4. Type "<td> content </td>" in between the "tr" tags from Step 3 to create a column in your table. Then replace "content" with any text, graphics or hyperlinks. Repeat this step for the desired number of columns.

5. Change the original "<table>" tag from Step 2 to "<table border="1">" to add a border to your table's elements. All rows and columns will now be visible in a web browser. Insert a higher number into the border tag in order to create a thicker border.

6. Save your code file as a .html file and place it on your web server. When you access the site in a web browser, the table's rows and columns will be visible.