Lesson 6
Paragraph and its attributes
Blockquote:
Practice HTML Use
this feature or your Notepad.
Color
chart: Click here to chose color
for your background.
Paragraph and its Attributes:
This lesson will teach you how to add attributes
of paragraph. Earlier we saw how <p>
paragraph tag works. Now we are going to see it in little
detail.
This was our basic <html> tags and <p>
tag.
<html>
<head>
<title>
My Web Page
</title>
</head>
<body>
<p>Hi,
Welcome to my web.</p>
</body>
</html> |
Attribute:
Attribute of Paragraph is
Align and it has some properties.
its properties are left,
right, center and justify. It
means you can align your pragraph in left, center, and right
margin of the page and also you can justify it.
align="left" It
sets defualt alignment for paragraph as Left.
align="center" It
sets defualt alignment for paragraph as Center.
align="right" It
sets defualt alignment for paragraph as Right.
align="justify" It
sets defualt alignment for paragraph as Justify.
Ok let's see how it works. Type this code in your Notepad,
save it and look in your browser how it works. Or you can
type this code in our feature 'Practice HTML' and
see it.
You can see, here we took the old code
and just added align="left"
in <p> tag.
<html>
<head>
<title>
My Web Page
</title>
</head>
<body>
<p align="left">Hi,
Welcome to my web. My
paragraph is left aligned. It stays at the left margin
of the page. </p>
</body>
</html> |
Your text will look like this. You can see
it has aligned the text in left margin of the page.
Now let's see how it looks when you align
it at center. Now type "center" instead of left.
Type this code in your "Notepad" or in "Practice
Html" to see how it works.
<html>
<head>
<title>
My Web Page
</title>
</head>
<body>
<p align="center">Hi,
Welcome to my web. My
paragraph is center aligned. It stays at the center
of the page. </p>
</body>
</html> |
Now your paragraph will look like this. You
can see now it is aligned in the center of the page.
The same way try <p
align="right"> and
it will align your page in the right margin of the page.
Your page should look like this.
Now let's try Justify. Copy this code and
paste it in your notepad or use our feature "Practice
Html". It will make your paragraph as Justified. You
can see here is a very little change in this code. Just
we've put "justify" instead of "center".
<html>
<head>
<title>
My Web Page
</title>
</head>
<body>
<p align="justify">Hi,
Welcome to my web. My
paragraph is justified. It
is called paragraph and my paragraph is justified. It
Justifies the page. It is called paragraph and my paragraph
is now justified. It Justifies the page. It is called
paragraph and my paragraph is now justified. It Justifies
the page.</p>
</body>
</html> |
Now your paragraph will look like this.
You can see now paragraph looks justified in both sides
of page and page looks neat.
Blockquote:
It is another method to indent the paragraphs.
You can indent your page from left and right margin so that
text may not go out side of the margin. It uses opening
and closing tags.
<blockquote> Opening
tag
</blockquote> Closing tag
Please copy this code or type it and look how it works.
You can see all the codes were old one only we've added
the opening and closing <blockquote> tags instead
of <p> tag.
<html>
<head>
<title>
My Web Page
</title>
</head>
<body>
<blockquote>Hi,
Welcome to my web. My
paragraph is indented from both sides. Hi,
Welcome to my web. My
paragraph is indented from both sides. Hi,
Welcome to my web. My
paragraph is indented from both sides. Hi,
Welcome to my web. My
paragraph is indented from both sides.</blockquote>
</body>
</html> |
Your page will look like this. You can
see it has indented the page from both margins and left the
equal space form both sides.
