Paragraph in html page Write paragraph in html page by using <p>…</p> tag. <p> is the opening tag and </p> is the...
Paragraph in html page
Write paragraph in html page by using <p>…</p> tag. <p> is the opening tag and </p> is the closing tag.
Example:
Never tell a lie. Always tell the truth. Don't waste your time.This
is high time to do something for the society. Don't justify yourself
by your academic results. Justify yourself by your creativity, passion.
Try to go to bed early and rise early. Make sure you have done your
everyday task in time.
Show this in HTML page.
Solution:
<!DOCTYPE html>
<html>
<head><title>Creating paragraph</title></head>
<body>
<p>
Never tell a lie. Always tell the truth. Don't waste your time.This
is high time to do something for the society. Don't justify yourself
by your academic results. Justify yourself by your creativity, passion.
Try to go to bed early and rise early. Make sure you have done your
everyday task in time.
</p>
</body>
</html>
We will see in the output like this
Break tag
Here all sentences are not showing as you want to show. Here sentences are in same line. If we want to start sentence from a new line we have to use another tag after the word from where we want to break the line and start a new line. That is <br> tag. This tag has no closing tag.
Previous example with <br> tag
<!DOCTYPE html>
<html>
<head><title>Creating paragraph</title></head>
<body>
<p>
Never tell a lie. Always tell the truth. Don't waste your time.This<br>
is high time to do something for the society. Don't justify yourself<br>
by your academic results. Justify yourself by your creativity, passion.<br>
Try to go to bed early and rise early. Make sure you have done your<br>
everyday task in time.<br>
</p>
</body>
</html>
We will see in the output like this
We can see now it is showing the result in web page same as we expected.
Align attribute
Usually paragraph supports left margin. Sometime we need to use right margin or both margin or central alignment. For doing this we have to use an attribute in <p>…..</p> tag that is “align”.
If we only use <p>..<\p> tag then that will show the paragraph from left side. For aligning from right side we have to use align = "right". If we need to align centrally we have to use align ="center". For aligning from both side of the margin we have to write align ="justify".
Align left
If we want to align in left we need not use attributes with <p>...</p>. It is aligned in left in default.
<!DOCTYPE html>
<html>
<head><title>Creating paragraph</title></head>
<body>
<p>
Never tell a lie. Always tell the truth. Don't waste your time.This<br>
is high time to do something for the society. Don't justify yourself<br>
by your academic results. Justify yourself by your creativity, passion.<br>
Try to go to bed early and rise early. Make sure you have done your<br>
everyday task in time.<br>
</p>
</body>
</html>
We will see in the output like this
Align right
For this we have to write the attribute in <p>..</p> tag like this.
<p align = "right">....</p>
Example
<!DOCTYPE html>
<html>
<head><title>Creating paragraph</title></head>
<body>
<p align = "right">
Never tell a lie. Always tell the truth. Don't waste your time.This<br>
is high time to do something for the society. Don't justify yourself<br>
by your academic results. Justify yourself by your creativity, passion.<br>
Try to go to bed early and rise early. Make sure you have done your<br>
everyday task in time.<br>
</p>
</body>
</html>
We will see in the output like this
Align center
For aligning center we have to write the attribute in <p>..</p> tag like this.
<p align ="center">....</p>
Example
<!DOCTYPE html>
<html>
<head><title>Creating paragraph</title></head>
<body>
<p align ="center">
Never tell a lie. Always tell the truth. Don't waste your time.This<br>
is high time to do something for the society. Don't justify yourself<br>
by your academic results. Justify yourself by your creativity, passion.<br>
Try to go to bed early and rise early. Make sure you have done your<br>
everyday task in time.<br>
</p>
</body>
</html>
We will see in the output like this
Aligning from both side of the margin
For aligning from both side of the margin this we have to write the attribute in <p>..</p> tag like this.
<p align = "justify">....</p>
Example
<!DOCTYPE html>
<html>
<head><title>Creating paragraph</title></head>
<body>
<p align ="justify">
Never tell a lie. Always tell the truth. Don't waste your time.This<br>
is high time to do something for the society. Don't justify yourself<br>
by your academic results. Justify yourself by your creativity, passion.<br>
Try to go to bed early and rise early. Make sure you have done your<br>
everyday task in time.<br>
</p>
</body>
</html>
We will see in the output like this
If we summarize over all concept-
<p>...</p> : Creating paragraph.
<br> : Breaking line.
Align
< p align = "right" >...</p> : Aligning right
< p align = "center" >...</p> : Aligning center
< p align = "justify" >...</p> : Aligning from both side of the margin
No comments