Let's synchronize what we've learnt on HTML till now – creating an HTML document, modifying the same, inserting HTML headings in your document. And I'm sure that by now, you must be feeling quite comfortable and accustomed with the process of editing texts within your HTML document and subsequently reloading it into your web browser. So now you can relax for yet another simple and fast HTML lesson – inserting paragraph breaks.
No matter what media you may use for publishing your written texts, the use of paragraphs is indispensable. The paragraph tag is very basic and a great preparatory tag for beginners because of its simplicity.
Welcome to Lesson 5 – Inserting HTML Paragraphs
Paragraphs in HTML are defined with the <p> tag. When you insert a <p> tag in your HTML file, your web browser interprets the command and accordingly places a blank line above and below the text of the paragraph. These programmed blank lines are instances of how a tag scripts a paragraph and how well the browser grasps the approach of displaying the paragraph text courtesy, the paragraph tags. It is the letter "P" that symbolizes a certain chunk of text information as a paragraph. As specified in one of our earlier lessons, HTML tags are not case-sensitive. Irrespective of whether you write it as <p> or <P>, it always marks the beginning of the paragraph, while the tag </P> or </p> signifies the end. Now paragraph tags are special because of their uniqueness! Unlike the other "tagging" - <b>, <i>, <h1> - in case of paragraphs, the closing tag is however optional, as a paragraph is automatically ended when you start another paragraph, or when you start a heading, block quote, list, table or form. And since the <h> tags carry along with them a built-in break, as such it is unnecessary to put <p> tag before a header tag. Example:
<p>
<h2>Enter the heading text</h2>
But, how to insert and view paragraph breaks in your HTML document? Let's find out...
- First of all, re-open your workspace (if not opened).
- Go to the text editor program.
- Open the HTML working document created in the previous lessons and subsequently modified, in the text editor.
- Move the chunks of text information that you want to bring headings like "Introduction", "Brief History", and “Reference” and so on.
- Once you're done with the changes, save it in the text editor.
- Return to your web browser.
- Use the “Open Local…” command from the File menu to open your working document (if not opened).
- Next, reload your browser to view the changes that have been implemented. With the changes in the headings made, now suppose you want to insert a paragraph break between the introductory sentences.
- Once again return to the HTML document in the text editor program.
- Following the sentence wherein a paragraph insertion is required, enter the paragraph tag:
<p>
<h2>Introduction</h2>
Following the first segment of your introductory text, enter another paragraph tag.
<p>
Here you enter the second segment of your introductory text </p>.
- Save the changes in the text editor.
- Return to your web browser and Reload the document. The two sentences of the introduction should now be separate paragraphs.
<P> tags … so that’s all insertion of paragraphs in an HTML document, huh? No …. Not in the HTML writers’ world wherein the line breaks (<BR>) and horizontal rules (<HR>) tags are all grouped into this category. Put a <HR> tag just above the introduction heading and it’ll work on separating the opening sentence of the lesson from the rest of the text to follow. And finally it’s the <BR> tag, – line break – that forces the text to take a different line, much like the <p> tag, but without inserting a blank line inbetween the line break. The tagging for line breaks - <br> - can be employed for special layout styles for your different sections of your headlines. The header tags <h1>, <h2>, automatically insert a blank space above and below the text of the header tag. There are groups of web page authors who prefer this particular style that controls this white space.
Following is an example to help you attain a complete understanding of the concept:
Sample Text with <p> tags ONLY
HTML CODES
The paragraph tag is very basic and
a great introductory tag for beginners
because of its simplicity.
<p>
<h2>Welcome to lesson 5 - ….
<p>
Paragraphs in HTML are defined
with the <p> tag
|
RESULT
The paragraph tag is very basic and a great introductory tag for beginners because of its simplicity.
Welcome to Lesson 5 - …
Paragraphs in HTML are defined with the <p> tag. |
Sample Text with <p> and <br> tags
HTML CODES
The paragraph tag is very basic and
a great introductory tag for beginners
because of its simplicity.
<p>
<h2>Welcome to lesson 5 - ….
<br>
Paragraphs in HTML are<br> defined
with the <p> tag
|
RESULT
The paragraph tag is very basic and a great introductory tag for beginners because of its simplicity.
Welcome to Lesson 5 - …
Paragraphs in HTML are
defined with the <p> tag. |
This completes our lesson on HTML paragraph breaks.
Original Authors: Rajat
Edit Update Authors: M.A.Harris
Updated On: 01/05/2009
