Definitive Guide To HTML Tables - Live Coding
Live coding session and practice for all concepts related to HTML tables. Follow along to understand how to use fixed or automatic table layouts, apply borders, add row and column headers, play with table and column widths, change fonts, add nested tables, apply zebra striping to data rows, add header and footer sections, and span and style cells. In short a comprehensive coverage of all useful items related to HTML tables.
Playlist: • Yet Another Full Stack Development Co...
Concepts video (Part 1): • Definitive Guide To HTML Tables - Con...
00:00 Introduction
01:16 Writing a basic HTML table
03:00 Adding header row to HTML table
04:30 Adding column headers to HTML table
06:30 Adding caption to HTML table
06:55 Adding styling to HTML table
07:26 Adding border to HTML table and its cells
09:00 Removing double borders from HTML table - collapsing borders via border-collapse
09:45 Adding background image to HTML table
10:20 Styling and fitting background image of HTML table
11:32 Repeating background image of HTML table
12:03 HTML table layout using table-layout
13:40 HTML table fixed layout with percentage width issues
15:03 Why max width does not work with HTML tables
19:01 Fixed table layout rules for table and column width
22:40 Auto vs Fixed table layout comparison
29:10 Controlling text overflow in HTML tables
31:35 Adding multiple row headers in HTML table with colspan
32:55 Adding multiple column headers to HTML table with rowspan
34:35 Using colgroup and col elements to style HTML table columns
35:50 Adding and styling thead element
37:05 Styling row and column headers using CSS for HTML table
38:15 Styling td elements or data cells in HTML table via CSS
38:30 Styling caption of HTML table
39:00 Changing font alignment of HTML table elements
39:45 Adding padding to HTML table cells
40:48 Nested tables in HTML table
41:50 Styling nested HTML tables in CSS
43:00 Change font size of HTML table
44:50 Adding tfoot and styling it via CSS
46:30 Zebra striping in HTML table (Different color for even and odd rows)
49:27 Removing borders of select cells in HTML table
#htmltables #htmltable #livecoding #htmllivecoding #webdevelopment #frontendwebdevelopment #fullstackdevelopment #fullstackcourse
#fullstackdevelopment