Basic Text Formatting

This section addresses the way in which you markup text. There are that help you mark up your text, adding structural information to your document.

In this section you will learn how to use what are known as basic text formatting elements.

If you want people to read what you have written, then structuring your text well is even more important. People have trouble reading wide, long paragraphs of text on web unless they are broken up well.


White Spaces and Flow

It is very important to know what HTML does when it comes across spaces and how browsers treat long sentences and paragraphs of text.

Consider the following code:-

In the above code there are some multiple white spaces but when this is going to display in the browser, browser treats multiple spaces and several carriage returns as a single space.

Following is the way how the browser displays our code:-

Creating Headings

No matter what sort of a document you are creating, most documents have headings in some form or another. Heading tells the purpose of the following text of it. Headings can also help to structure a document.
There are 6 levels of headings tn HTML.
<h1>, <h2> ,<h3>, <h4>, <h5>, <h6>

Heading elements also can carry attributes. The attributes which are carried by heading tag:-

• align
• class
• id
• dir
• lang
• xml:lang

Align attribute can align the text to right,left and center as we want, but this attribute is not used very much now because we can re-align using CSS.

Creating Line Breaks

Line breaks can be created by using <br/> tag. Whenever you use this tag anything following will start in next line. <br/> can carry core attributes as well as an attribute called 'clear', which can be used with images.

Attributes used in <br/> element :-

• clear
• class
• id
• style
• title

Creating Paragraphs

The <p> element offers another way to structure the text. Each paragraph of text should go in between opening <p> and closing </p> tags.

When browser displays a paragraph it usually inserts a new line before the next paragraph.

Attributes used in <p> element:-

• align
• class
• id
• style
• title
• dir
• lang
• xml:lang

Creating Preformatted  Text

Sometimes you want your text to follow the exact format of how it is written in the HTML code. You can do this using <pre> tag.

Any text between the opening <pre> tag and closing </pre> tag will preserve the formatting of the source document.

Two of the most common uses of the <pre> element are to display tabular data without the use of a table and to represent computer source code.

Share with Friends....