How to Create Tables in HTML | HTML5 Table Tutorial

Learn how to create tables in HTML. In this HTML5 table tutorial, you will learn how to add a table to your web page. You will also learn the available attributes to help you design your table with semantics and accessibility in mind.

🚀 This lesson is part of an HTML for Beginners tutorial series playlist:

How to Create Tables in HTML | HTML5 Table Tutorial

(00:00) Intro
(00:05) Welcome
(00:25) When and when NOT to use tables
(01:04) Creating a basic table
(04:16) Adding a small amount of CSS
(04:41) Table width is based on content
(05:38) Adding table headings
(06:35) colspan attribute
(07:05) rowspan attribute
(07:47) Table semantics
(08:11) Caption element
(08:51) thead, tbody, and tfoot elements
(11:04) Adding row headings
(13:15) scope attribute
(15:32) Validate your HTML code

⚙ Web Dev Tools:

📚 References:

🚀 Semantic HTML References:

🚀 HTML Table References:

✅ Follow Me:

Was this tutorial about creating HTML Tables helpful? If so, please share. Let me know your thoughts in the comments.

#html #html5 #tables

[plaguegames]

Thank you for the tutorial Dave and my thanks to everyone who contributed to remove them from being used to layout entire pages :D

[svbgfur]

You made everything in HTML super easy for me
A big thank you to you

[jwqnrjy]

You made creating tables in HTML5 super easy....tysm

[fairytail]

A very well-explained video. Keep up the good work!

[Josiah-Sitariko]

This has helped me nice explanation. Thanks

[fabrice]

I like your videos. Really helpful and clear.

[letuslearnmore]

(Ha I'm Dav ) This sentence has become like my name :)

[Valdaur]

I find tables a bit confusing to get my head around sometimes. I find it hard to visualise the table as I am writing the code for it. But I think I understand the whole Col/row span and scope=row/col concept as the columns are side by side and the rows are stacked on top of each other. So when doing rowspan it's going down a row, and colspan is going sideways to the adjacent column. Scope is going either sideways (if a row) and down (if a col). I can understand why this may be confusing at first.

[ahmad-murery]

I'm so old I remember designing website layouts using tables 😎
and I totally forget about the caption tag

20k milestone on the way 💨
Thanks Dave,

[JohnMacPherson-hryz]

min 10:54 the longer is the last sentence in the table - the longer is the width of the table. How do you make that sentence wrap?

[Valdaur]

4:55 For some reason, my table doesn't show as having any margin by default. My code is also the same as yours too.

[avvaiaravind]

Hi! After writing css code in main.css
I can't see Table in my website even after saving and one more it asks to put colon near solid #eee
Even after putting I can't see table and it shows unknown property.

Can anyone help me with this!!!

[fabrice]

What's the point of using <time> ?

[felicialeann]

4:23 I'm new to all of this. I'm watching your videos in order. I rewatched this multiple times.... I think you accidentally left out the part where you show us where the pasted css came from to create the table. You say to open the css file.... then you say to past in the css for the table.... but where did that come from???? From the title of the video I thought the whole point of this video was to show us how to put a table into our html? I'm really confused. Do we just google " How to add CSS table to beginner html index file" ? and then follow whatever we find? and that's the missing part of your video? please help. or is there a paid link to the missing part of your video?