Scribd
Upload
513 views14 pages

Empowerment Technologies - Lesson 5

The document discusses three types of lists (unordered, ordered, and definition lists) that can be used to structure text in an outline format. It also discusses how tables can be used to organize information using HTML tags, including different table elements like rows, columns, and cells. The document provides details on various HTML table tags and attributes that can be used to control the formatting and appearance of tables.

Uploaded by

Marck Lean
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
513 views14 pages

Empowerment Technologies - Lesson 5

The document discusses three types of lists (unordered, ordered, and definition lists) that can be used to structure text in an outline format. It also discusses how tables can be used to organize information using HTML tags, including different table elements like rows, columns, and cells. The document provides details on various HTML table tags and attributes that can be used to control the formatting and appearance of tables.

Uploaded by

Marck Lean
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 14

EMPOWERMENT technologies

List - Structure text in an outline format, which helps itemized information.


Three Types of List:
• Unordered List
• Ordered List
• Definition List
EMPOWERMENT technologies

Unordered List
Also known as bulleted list. They format information as
bullet points.
EMPOWERMENT technologies
EMPOWERMENT technologies

Ordered List

Also called numbered lists. The information in


this type of list is shown as numbered or lettered
points
EMPOWERMENT technologies
EMPOWERMENT technologies

Nested List
Example of Unordered and Ordered Nested List
EMPOWERMENT technologies

Tables – allow you to organize information on a Web


page using HTML tags.
TABLE ELEMENTS
row – is a horizontal line of information
Column- is a vertical line of information.
Cell – is the intersection of a row and a column.
EMPOWERMENT technologies

A cell can be one of two types:


Heading cell – displays text as bold
and center-aligned
Data Cell – displays normal text that
is left-aligned.
EMPOWERMENT technologies
Table Borders, Headers, Captions, and Rules

table border- is the line that encloses the perimeter of the


table
Table header – is the same as a heading cell – that is, it is
any cell with bold text that indicates the purpose of the row
and column.
Table caption – is descriptive text located above or below
the table that further describes the purpose of the table.
EMPOWERMENT technologies
HTML TABLE TAGS

Tag Functions
<table></table> • Indicates the start and end of a table
• All other table tags are inserted within these tags

<tr></tr> • Indicates the start and end of a table row


• Rows consist of heading or data cells

<th></th> • Indicates the start and end of a table heading


• Table heading default to bold text and center-alignment

<td></td> • Indicates the start and end of a data cell in a table


• Data cells default to normal text and left-alignment.
EMPOWERMENT technologies

Attribute Effect Example


Align=(left,center,right) Positons the table in the window. <table align=center>

Background=”url” Specifies the location of an image loaded as a <table


background for the table background=”me.jpg”>

Bgcolor=(color) Specifies the tables background color. <table bgcolor=green>


Cellpadding=“n” Defines space within cells in pixels <table cellpadding =2>

Cols =“n” Defines number of columns <table cols=“2”>

Border=”n” Specifies the thickness of borders around each <table border=0>


cell.
EMPOWERMENT technologies

Bordercolor=(color) Specifies the color of the <table


borders. bordercolor=blue>
Cellspacing=”n” Specifies the space between <table cellspacing=5>
borders.
Width=”n” Specifies the width of the table <table width=300>
EMPOWERMENT technologies
Attribute Effect Example
align=(left,right, Aligns text in the cell or row. <td alidn=center>
center,
justify)
Background=”url” Specifies the location of an image file that serves as <tr bagckground=”me.jpg”>
the background.

Bgcolor=(color) Specifies the background color <tr bgcolor=”red”>


Bordercolor=(color) SSpecifies the color of the table border <tr bordercolor=”pink”>

Valign=(top,middle,bo Vertically aligns row/cell(top,middle,bottom) <td valign=“top”


ttom)
Colspan=“n” Sets number of columns spanned by a cell <th colspan=“5”>

Rowspan=“n” Sets number of rows spanned by a cell <th rowspan=“2”>

You might also like