Lines And Paragraphs in HTML

While writing a book, an author divides their thoughts and sequences into paragraphs. The information is actually organized into paragraphs and that can be presented in any way. The paragraphs are double justified or they are left justified. In HTML, something similar is to be followed and an HTML defining a paragraph is pretty straightforward, where the element “p” is defined as the paragraph. However, when you are presenting paragraph it is not so simple because there are numerous technical issues that is to be addressed.

  • The treatment of the white area
  • The justification
  • The line breaking and word wrapping
  • Hyphenation
  • Formatting the paragraphs with reference to the surrounding content
  • Written language conventions and text directions

All HTML documents are divided into paragraphs an as mentioned they are defined with <> tag. E.g.:

1
2
<p>This is a paragraph</p>
<p>This is another paragraph</p>

After finishing with the coding, it is always necessary to put the closing tag. In paragraphs, one of the important aspect is HTML line breaks, therefore for line breaking the <br/> tag can be used if you want to start a new paragraph. For example:

1
<p>This is<br />a para<br />graph with line breaks</p>

The <br/> is an empty HTML element and there is no end tag for this. In case of XHTML and XML and in any future version of HTML, there are no closing tags for the line break. In some browser writing <br> may also work instead of <br/> and this tag will work smoothly.

After the break tag, then there is a “no break” tag as well. The no break tag is indicated with <nobr> which is actually a Netscape extension that ensures that the browser doesn’t start with a new line in the text along with a tag. Whatever tag you use, break or no break, they should be used carefully or else the result will appear rugged.

Then the heading tag, where there are six tags that mark the headings <h1> to <h6>. With every higher number, the heading will be small but the character formatting with font and size can be set by individual user. The heading tags looks like:

1
<h1>the Title</h1>

Another important part in paragraphs is the Blackquote. This produces text that is indented to form the left and right wing. This tag is used for paragraphs that are quoted from one source. For example:

1
2
3
4
5
6
<blockquote>
    Mary had a little lamb,
    its fleece was white as snow,
    and it was <b>bold</b> and quite
    <i>italic!</i>
</blockquote>

Preformat is done with <pre> tag and this is used for fixed-width characters. Additionally, the browser place new lines with the text. In most cases, the browser ignores lines or spaces that are in the text and this will help you to write the text across the page till it reaches the boundaries of window.

1
2
3
4
<pre>
    As you can see the <b>Pre-Format</b>
    tag can be very useful!!!
</pre>

Code example is indicated by <xmp> tag is similar to <pre> but it ignore the tags that are placed in the text.

1
2
3
4
5
6
7
8
9
10
<xmp>
    All HTML tags are ignored
    until the end tag is
    encountered,
    so if you put <h1>
    inside <xmp> text,
    it is treated like any text!
    This is very useful when
    giving examples of HTML!
</xmp>