HTML: Tables

HTML: Tables

English | MP4 | AVC 1280×720 | AAC 48KHz 2ch | 1h 25m | 224 MB

Sometimes you need to share data, and not just visualizations, directly with other people. HTML tables make this easy. While they have a complex history of use and misuse, HTML tables are great at their key purpose: presenting data. In this course, learn how to create table structures that fit your data precisely, are easy to style, and work well for sharing. Instructor Jen Kramer covers the essential skills you need to learn to display and format tabular data on the web. Watch and learn how to build tables with HTML, style tables with CSS, and make your tables accessible to users with disabilities on all types of devices.

Topics include:

  • Adding content to tables
  • Defining table headers
  • Styling borders
  • Alternating table row colors
  • Grouping columns
  • Styling table borders, headers, and footers
  • Making tables responsive
Table of Contents

1 Create semantic HTML tables
2 What you should know
3 Working with CodePen
4 Display data semantically
5 Understand table rows and table data
6 Add content and data to table cells
7 Understand table headings
8 Identify table head, body, and foot
9 Include table captions
10 Group columns and apply to headers
11 Use colspan and rowspan
12 Challenge Mark up a table
13 Solution Mark up a table
14 Style table borders and basic styling
15 Style the table caption
16 Style your table headers and footers
17 Stripe table rows with background colors
18 Challenge Style HTML tables
19 Solution Style HTML tables
20 Responsive tables with side scrolling
21 Reformat a table for responsive layout
22 Final styling tweaks
23 Challenge Make tables responsive
24 Solution Make tables responsive
25 Next steps