Lesson 3 The <Blockquote>, <DIV>, and the <PRE> Tags

Unit I

KEYWORD
S
Internet

Block quote

blocked information

Browser

Hypertext

URL

The BLOCK QUOTE

The <BLOCKQUOTE> is used to set a part of your page an excerpt or
quotation from an author and makes a certain part of the document stand out
from the rest. Usually it indents the blocked information from both left and
right. It also supports the attribute CITE, shown in Table 1 which can be set on
the Web from which the quotation was pulled.
Table 3.1
Attribute
CITE

Values
URL

Description
Specifies the URL of
the quote, the one
taken from the web

Lesson 3 The <Blockquote>, <DIV>, and the <PRE> Tags

Unit I
Below is an HTML program applying the use of Blockquote.
HTML Program 1

Lesson 3 The <Blockquote>, <DIV>, and the <PRE> Tags

Unit I
The following is the Program Output of the HTML Program 1 using the
<BLOCKQUOTE> tag.
Program Output 1

Lesson 3 The <Blockquote>, <DIV>, and the <PRE> Tags

Unit I

Element of Division

The <DIV> element denotes the beginning of a division on a particular

document. It allows you to have style or language information to blocks of content.
It has an attribute ALIGN which is given a value of LEFT, RIGHT, and CENTER. The
value assigned to ALIGN denotes the alignment of element.
Below is a table containing the attribute align for the <DIV> tag.
Table 2
Attribute
ALIGN

Values
Left/Center/Right

Description
Specifies the division
of the content with
respect to horizontal
alignment

Below is a sample program using the DIV command or tag with its attribute.
HTML Program 2

Lesson 3 The <Blockquote>, <DIV>, and the <PRE> Tags

Unit I
The following is the Program Output of HTML Program 2 that used <DIV>
tag in the program.
Sample Output 2

Lesson 3 The <Blockquote>, <DIV>, and the <PRE> Tags

Unit I

Preformatted Element
The preformatted <PRE> tag helps you display the output just like how you
spaced your text in Notepad which is quite difficult to do in HTML. Paragraph <P>
tag or any of the highlighting tags should not be used within preformatted text;
however hypertext links can be included. The use of <PRE> tag is shown in HTML
Program 3.
HTML Program 3

Lesson 3 The <Blockquote>, <DIV>, and the <PRE> Tags

Unit I

The following is the Program Output of HTML Program 3 that used <PRE>
tag in the program.
Program Output 3

In the Program Output 3, notice that spaces and returns are lost and the
paragraph is set default to pitch font (usually courier).
7

Lesson 3 The <Blockquote>, <DIV>, and the <PRE> Tags

Unit I

KEYPOINTS

The <BLOCKQUOTE> is use to set a part of your page an excerpt or

quotation from an author and makes a certain part of the document stand
out from the rest.

The <DIV> element denotes the beginning of a division on a particular

document. It allows author to have style or language information to blocks
of content. It has an attribute ALIGN which is given a value of left, center or
right.

The preformatted <PRE> tag helps you display the output just like how you
have spaced your text in notepad which is quite difficult to do in HTML.

Lesson 3 The <Blockquote>, <DIV>, and the <PRE> Tags

Unit I
HANDS-ON ACTIVITY:

I.

Create a program that will display the following output:

(Excerpt from the Roman Empire).

Requirements for the sample output:

1st paragraph should use Div element, center and size h2.
2nd paragraph should use Pre element, size h5.
3rd paragraph should use Div element, align to the right, h5.