How to create a table in HTML

Author: Mark Sanchez
Date Of Creation: 28 January 2021
Update Date: 1 July 2024
Anonim
25: Table In HTML and CSS | How To Create Tables | Learn HTML and CSS | HTML Tutorial | CSS Tutorial
Video: 25: Table In HTML and CSS | How To Create Tables | Learn HTML and CSS | HTML Tutorial | CSS Tutorial

Content

It is quite difficult to create a table in HTML. But with the steps outlined in this article, you should be able to create one for your site.

Steps

  1. 1 Open a simple text editor program like Notepad or WordPad on Windows, or on Mac open TextEdit.
  2. 2 Enter all the text you want to see in front of the table.
  3. 3 Define the use of a table for an HTML document by entering the table> tag.

  4. 4 Hit Enter.

  5. 5 Enter the tag for opening row table using the tr> tag.
  6. 6Remember to build all the remaining elements from left to right.
  7. 7 Hit Enter.
  8. 8 Enter a start tag for the table heading using the th> tag.
  9. 9 Enter the title you want to use for the first column.
  10. 10 Enter a closing tag for the table heading element using the / th> tag.
  11. 11 Hit Enter.
  12. 12 Repeat steps (arranging items in columns from left to right).
  13. 13 Close this line by entering the / tr> tag.
  14. 14 Hit Enter.
  15. 15 Start another line with another tr> tag.
  16. 16 Hit Enter.
  17. 17 Enter the table data tag using the td> tag.
  18. 18 Enter the table data you want to include in each field.
  19. 19Work from left to right, filling in the data from the columns shown above.
  20. 20 Close each input with the / td> tag.
  21. 21 Repeat for all table data that you have.
    • For cells where you don't need to enter anything, enter td> and td> and nothing in between. This will be very useful for fields between two other fields.
  22. 22 Close each line with another / tr> tag.
  23. 23 Repeat each line down in addition to the tr> and / td> lines until each line is assembled.
  24. 24 Close the table with the / table> tag.
  25. 25 Enter the following HTML text as you need for the rest of the document.

Tips

  • Indent from each line so that you can understand what you are trying to do in your code.

Warnings

  • If you accidentally enter too many columns of data where there is no table heading, they will still be shown, but they will look a little silly and the reader will not understand what this information is for.
  • Building tables on an HTML page is a tricky process to understand. First, practice on the external data to see what it looks like, then browse and place the new table in its place.
  • The HTML table code is best left to advanced HTML coders. However, after you follow these instructions, you too will become one of them.