CS_10_Grade_Lesson_10_HTML_2_Presentation

Learning objective
10.4.2.1 use HTML tags when developing webpages

WHAT IS LIST ?In your life …

You have a list of your friends, telephone list and back list (people you dislike).
Every day you have a lot of something to do. So you must have a list for this to be in order.

In HTML…
Assume that you want to develop your site, so you should have a menu about your .
Menu appear as a vertical or horizontal.
You will use list to keep your verical menu in order.
Sometimes you will use lists with vertical menu, when you have sub menu.

Vertical menu

Horizontal menu

Horizontal menu with sub menu

WHAT IS LIST ?

TYPE OF LISTS

Ordered List
Unordered list

ORDERED LIST

When you want to order something you can order this by differnet method.
Type of ordered List
something
something else
another thing
---------------------------
something
something else
another thing
----------------------------
something
something else
another thing

ORDERED LIST

1. Coffee


2. Milk

Ordered list starts with

tag.
Each list item starts with the
1. tag.
   
   Test Code

   Result

   Coffe
   Milk

ORDERED LIST EXAMPLE

Letters list:

1. Apples


2. Bananas


3. Lemons


4. Oranges

Lowercase letters list:

1. Apples


2. Bananas


3. Lemons


4. Oranges

Letters list:
Apples
Bananas
Lemons
Oranges

Lowercase letters list:
Apples
Bananas
Lemons
Oranges

Result

Test Code

ORDERED LIST EXAMPLE

Roman numbers list:

1. Apples


2. Bananas


3. Lemons


4. Oranges

Lowercase Roman numbers list:

1. Apples


2. Bananas


3. Lemons


4. Oranges

Roman numbers list:
Apples
Bananas
Lemons
Oranges

Lowercase Roman numbers list:
Apples
Bananas
Lemons
Oranges

Result

Test Code

UNORDERED LIST

When you want to order something you can order this by differnet method.
Type of ordered List
Disc bullets type
Something
Something else
Another thing
------------------------------
Circle bullets type
Something
Something else
Another something
---------------------------------
Square bullets type
Something
Something else
Another something

ORDERED LIST

• Coffee


• Milk

An unordered list starts with the

tag..
Each list item starts with the
• tag.
  The list items are marked with bullets (typically small black circles).
  
  Test Code

  Result
  Coffe
  Milk

ORDERED LIST EXAMPLE

Disc bullets list:

• Apples


• Bananas


• Lemons


• Oranges

Circle bullets list:

• Apples


• Bananas


• Lemons


• Oranges

Square bullets list:

• Apples


• Bananas


• Lemons


• Oranges

Disc bullets list:
Apple
Bananas
Lemons
Oranges

Disc bullets list:
oApple oBananas oLemons oOranges

Square bullets list:
Apple
Banans
Lemons
Oranges

Result

Test Code

The

Tag

The tag defines a header cell in an HTML table.
Closing tag is
The text in elements are bold and centered by default.

Tag

The tag defines a standard cell in an HTML table.
The text in elements are regular and left- aligned by default
Closing tag is

Tag

The tag defines a row in an HTML table.
A element contains one or more or elements.
Closing tag is