Free
Tutorial from PrillyCharmin.com
Page
Components 1: Tables
OBJECTIVE:
to become familiar with the various parts of the web
page. Nothing on a web page is essential. You can do all
or nothing to it. A web page is exactly like a blank
sheet of paper. You start out with blank space and create
whatever you want with it.
Tables
Graphics &
Photos
Links &
Navigation Buttons
Page Setup
Multiple Pages
TABLES: The pale pink box in the
center of this lesson page is a table. You can see the
borders of it, and the background color is pale pink.
The maroon color bar at the top,
that says LESSON 5, is a row that's part of this table.
The background of that row has the maroon color applied
to it. There are two additional rows at the bottom of
this table. (The horizonal lines on
this page are only lines: notice that they don't quite
touch the border of the table, and are not part of the
structure of the table itself. )
You can specify how many rows and
columns you want in a table. The table on this page has a
total of 4 rows, which are easy to see because of their
colors: maroon, pale pink, dark blue and maroon.
You can have a border or no
border on your tables...
| The text in this area is in a new table. You
can't see the table because the borders are
invisible and there is no background color. The
only color you see is from the table that's
underneath it. |
| Table
Properties |
| Now I copied that same table and
pasted it here. If I apply borders, rows and
columns, plus a background color, you can see all
the components of this table. |
You can select the Table
Properties from the Table Menu at the top of
Front Page. Or, right click anywhere in the Table
and select the table properties from there. |
This table has a lavendar
background, a border, 3 rows and 3 columns. |
| |
|
|
| Cell
Properties |
| The different
sections in the table are called CELLS. |
|
| Each cell can have
it's own properties that are different from the
table it's in. |
In this cell, I applied a
different background color and changed the text
color to white. |
| In this row, I merged the 2 cells
so there is only one column, instead of two. |
| The cell settings can be
changed in CELL PROPERTIES. Use the Table Menu in
Front Page to go to CELL PROPERTIES. Or, you can
right-click in the Cell you want to change, and
select the CELL PROPERTIES menu from there. |
| You can split
cells as well as merge them. |
These two cells
were split from one cell. |
|
Nested Tables
| You can
"nest" tables
inside one another and
apply different
backgrounds and colors,
for decorative effects.
This assortment of boxes
is 4 tables nested inside
one another. I
applied cellpadding
and cellspacing
so the borders of the
tables will not touch.
That's why there is a
little bit of space
between each of the
tables.
You can use
tables like a Picture
Frame...
|
|
|
|
| Tables can have a
background graphic applied. This set of 2
tables has the basket weave background
applied to the first table, and the
inside table is pale pink. |
|
| You can even apply
colors to the borders of a table. I set
the border width to 15 so you can see it
clearly. The light border (on top) is
dark blue and the dark border (on bottom
edge) is black. This can give a nice 3D
effect to your tables. |
|
|
