CS_10_Grade_Lesson_10_HTML_2_Presentation
Оценка 4.7

CS_10_Grade_Lesson_10_HTML_2_Presentation

Оценка 4.7
ppt
09.05.2020
CS_10_Grade_Lesson_10_HTML_2_Presentation
CS_10_Grade_Lesson_10_HTML_2_Presentation.ppt

HTML

HTML

HTML

Learning objective 10.4.2.1 use

Learning objective 10.4.2.1 use

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)

WHAT IS LIST ? In your life … You have a list of your friends, telephone list and back list (people you dislike)

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

In HTML… Assume that you want to develop your site, so you should have a menu about your

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

TYPE OF LISTS Ordered List Unordered list

TYPE OF LISTS

Ordered List
Unordered list

ORDERED LIST When you want to order something you can order this by differnet method

ORDERED LIST When you want to order something you can order this by differnet method

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 Coffee Milk Ordered list starts with tag

ORDERED LIST Coffee Milk Ordered list starts with tag

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:

ORDERED LIST EXAMPLE Letters list:

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:

ORDERED LIST EXAMPLE Roman numbers list:

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

UNORDERED LIST When you want to order something you can order this by differnet method

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

ORDERED LIST Coffee Milk An unordered list starts with the tag

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:

ORDERED LIST EXAMPLE Disc bullets list:

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

Skills Criteria for success The student has achieved the learning goal if

Skills Criteria for success The student has achieved the learning goal if

know the basics of web programming and be able to compare the methods of creating websites

Skills

Criteria for success

The student has achieved the learning goal if

Apply of knowledge

Illustrates the skill of using the tags , , , Ordered List, Unordered list when creating your own web page</p></td></tr></table><strong><p style="text-align: center">Task for individual work:<br></strong><br><strong>Creating a web-page using handout #1</strong></p>

Tag The tag defines an HTML table

Tag The tag defines an HTML table

Tag

The

tag defines an HTML table.
An HTML table consists of the
element
closing tag is

An HTML table has two kinds of cells:
Header cells - contains header information (created with the element)
Standard cells - contains data (created with the element)

Tag The tag defines a header cell in an

Tag The tag defines a header cell in an

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

Tag The tag defines a standard cell in an

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

Tag The tag defines a row in an

Tag

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

Skills Criteria for success The student has achieved the learning goal if

Skills Criteria for success The student has achieved the learning goal if

know the basics of web programming and be able to compare the methods of creating websites

Skills

Criteria for success

The student has achieved the learning goal if

Apply of knowledge

Illustrates the skill of using the tags , , , <table>, <th>, <td>, <tr> when creating your own web page</p></td></tr></table><strong><p style="text-align: center">Task for individual work:<br></strong><br><strong>Creating a web-page using handout #2</strong></p>

CS_10_Grade_Lesson_10_HTML_2_Presentation

CS_10_Grade_Lesson_10_HTML_2_Presentation
Скачать файл