Overview
-
Sometimes you need to share data, and not just visualizations, directly with other people. HTML tables make this easy. Discover how to build and style tables in this course.
Syllabus
-
Introduction
- Create semantic HTML tables
- What you should know
- Working with CodePen
- Display data semantically
- Understand table rows and table data
- Add content and data to table cells
- Understand table headings
- Identify table head, body, and foot
- Include table captions
- Group columns and apply to headers
- Use colspan and rowspan
- Challenge: Mark up a table
- Solution: Mark up a table
- Style table borders and basic styling
- Style the table caption
- Style your table headers and footers
- Stripe table rows with background colors
- Challenge: Style HTML tables
- Solution: Style HTML tables
- Responsive tables with side scrolling
- Reformat a table for responsive layout
- Final styling tweaks
- Challenge: Make tables responsive
- Solution: Make tables responsive
- Next steps
