2 Computer science grade 10 Tables_presentation1_ 1 variant

Tables

10.4.2.1 use HTML in web-development

Students know

- Demonstrates the skill of creating, saving and opening your own web page.
- Demonstrates knowledge of web document structure
- Uses tags to create a table on your own webpage.

Describe the structure of the HTML webpage.

What tag is used to create the Lists?

What tags are used for formatting text?

HTML Tables

An HTML table is defined with the 

HTML Table - Adding a Border

A border is set using the CSS border property:

table, th, td
{    border: 1px solid black;}

If you want the borders to collapse into one border, add the CSS border-collapse property:

table, th, td {    border: 1px solid black;    border-collapse: collapse;}

HTML Table - Collapsed Borders

Table - Adding Cell Padding

Cell padding specifies the space between the cell content and its borders.
To set the padding, use the CSS padding property:

th, td {    padding: 3px;}

th, td {    padding: 9px;}

HTML Table - Left-align Headings

By default, table headings are bold and centered.
To left-align the table headings, use the CSS text-align property:

th {    text-align: left;}

Border spacing specifies the space between the cells.
To set the border spacing for a table, use the CSS border-spacing property:

table {    border-spacing: 5px;}

table {    border-spacing: 25px;}

Task