heading and hr tags in html

12
Lesson 2 The Heading<H>, <P>, and <HR> Tags Unit I Internet Heading <H1> Browser Hypertext URL The Heading Elements Heading elements are commands in HTML used to give your Web page a title at a glance. Every web page needs to have a descriptive title to help the visitor understand at a glance the purpose of the web page. The web page title should be informative and concise. The most visible heading is the <H1> tag then followed by <H2> then <H3> and so on and so forth. It is commonly mistaken that the biggest of the heading is <H6>. Below is the sample program that applies the use of Heading elements. HTML Program 1 1 KEYWORDS

Upload: john808

Post on 10-Apr-2016

229 views

Category:

Documents


4 download

DESCRIPTION

html

TRANSCRIPT

Page 1: heading and hr tags in html

Lesson 2 The Heading<H>, <P>, and <HR> Tags Unit I

Internet Heading <H1>

Browser Hypertext URL

The Heading Elements

Heading elements are commands in HTML used to give your Web page a title at a glance. Every web page needs to have a descriptive title to help the visitor understand at a glance the purpose of the web page. The web page title should be informative and concise.

The most visible heading is the <H1> tag then followed by <H2> then <H3> and so on and so forth. It is commonly mistaken that the biggest of the heading is <H6>.

Below is the sample program that applies the use of Heading elements.HTML Program 1

1

KEYWORDS

Page 2: heading and hr tags in html

Lesson 2 The Heading<H>, <P>, and <HR> Tags Unit I

In the program, the command <H1> TIGRIS-EUPHRATES CIVILIZATION </H1> has the biggest in header size of output while the smallest is <H6> TIGRIS-EUPHRATES CIVILIZATION </H6>. The command header decreases in output size as header increases its header number.

Below is the sample output that uses the above mentioned tags.

Program Output 1

2

Page 3: heading and hr tags in html

Lesson 2 The Heading<H>, <P>, and <HR> Tags Unit I

Element of Paragraph <P>

Text-based web pages consist of paragraphs. One of the most common and basic in HTML commands is the Paragraph. Revision in HTML specifies that the command for paragraph which is <P> is previously used as page separator rather than a container. But now the <P> tag should be placed at the beginning of a paragraph, the end tag </P> is optional.

Most of the HTML commands have attributes. Attributes are accompanying commands.

Below is the table showing the values and description of an Attribute.

Table 1

Attribute Values DescriptionALIGN (Left/Center/Right) Specifies the

alignment of a paragraph

Below is the sample program containing the Attribute Align.

HTML Program 2

3

Page 4: heading and hr tags in html

Lesson 2 The Heading<H>, <P>, and <HR> Tags Unit I

The command <P> or paragraph inserts paragraph break at the current point in the document. The first line of output by default is aligned left. You can choose possible values for the attribute Align if you like the text to be aligned left, right or center. The possible values for the attribute Align are shown in Table 1.

Below is the sample output from the HTML Program 2.

Program Output 2

4

Page 5: heading and hr tags in html

Lesson 2 The Heading<H>, <P>, and <HR> Tags Unit I

Horizontal Rule

The Horizontal Rule or <HR> element produces a horizontal line which can be used to separate text or break part of documents. The <HR> tag does not require end tag. The horizontal rule can be used to break your web page into sections or to simply separate the header and footers from the other section of the page.

Below is the table containing the attributes used in the command or <HR> tag.Table 2.2

Attributes Value Description

ALIGN Left/Center/Right Specifies the alignment of the horizontal rule

NOSHADE Specifies that the line that appear is a solid line

SIZE “#Pixels” Declares the height of the line in pixels

WIDTH “#Pixels or % of the page size”

Declares the length of the line in pixels.

5

Page 6: heading and hr tags in html

Lesson 2 The Heading<H>, <P>, and <HR> Tags Unit I

Below is the sample program that applies the attributes in Table 2.

HTML Program 3

6

Page 7: heading and hr tags in html

Lesson 2 The Heading<H>, <P>, and <HR> Tags Unit I

The following is the sample output from the HTML Program 3.

Program Output 3

7

Page 8: heading and hr tags in html

The Program output 3 shows that the HR element makes a straight line between the text “MESOPOTAMIA” and the text “EGYPT AND INDUS RIVER”.

Lesson 2 The Heading<H>, <P>, and <HR> Tags Unit I

Heading elements are commands in HTML used to give your Web page a title at a glance. Every web page needs to have a descriptive title to help the visitor understand at a glance the purpose of the web page.

Text based web pages consist of paragraphs than any other kind of text block. One of the most common and basic in HTML commands is the paragraph.

Revision in HTML specifies that the command for paragraph which is <P> is previously used as page separator rather than a container.

Most of the HTML commands have attributes. Attributes are accompanying commands.

The command <P> or paragraph inserts paragraph break at the current point in the document. The first line of output by default is aligned right.

8

KEYPOINTS

Page 9: heading and hr tags in html

You can choose possible values for the attribute Align if you like the text to be aligned left, right or center.

The Horizontal Rule or <HR> element produces a horizontal line which can be used to separate text or break part of documents. The <HR> tag does not require end tag.

Lesson 2 The Heading<H>, <P>, and <HR> Tags Unit I

HANDS-ON ACTIVITY:

CREATING A WEB PAGE.

I. Create a program that will display 2 paragraphs consisting of the following topics:

1st paragraph = China’s Great Wall at Nanken. Over 6000 kilometers long, The Great Wall of China was Built in the Qin dynasty and Has often been repaired.

The paragraph should be align to the left, colored blue, size is 3.Use HR align in between these paragraph

2nd paragraph = Han dynasty horse figure, 2nd century c.e. The Chinese Obtained new horse breeds As they expanded into central Asia.

This paragraph should be align to the right, colored yellow, size is 3.9

Page 10: heading and hr tags in html

1