Space Management

there are many space management tags/symbol in HTML will be discussed in this topic. Space management in HTML refers to spaces between words, lines and paragraphs. Below are some tags that shows gaps/spaces between words, lines and paragraphs:
  •  
  • <br> tag
  • <p> tag
  • <blockquote> tag
  • heading tags (<h1> to <h6>)
  • <pre> Tag

&nbsp;
This symbol in HTML used to put space between words. This symbol must end with semicolon (;).

<br> Tag
This tag is used to put line break. Using this tag gaps between two lines can be given.

<p> Tag
This tag is used to define a paragraph. To put the content in a new paragraph we use this tag. <p> Tag puts a gap between two paragraphs OR HTML contents equal to 2 <br> tags. Some of the attributes of <p> tag are:
  • Align: This attribute is used to the content written under paragraph content It has four values called right, left center, justify.
  • Title: This attribute is used to put a title for paragraph content that is visible on mouse over of that content.
Note:
As a logical element, empty paragraphs are ignored by the browsers, so do not use empty <p> elements to add blank lines in your web pages. To create blank lines use the <br> tag, or use the CSS margin property instead.

<blockquote> Tag
This tag is used to indent content from left. Default indent distance of <blockquote> tag is 0.5 inch. We can embed/nest this tag to indent more.

Heading Tags
Heading tags in HTML are used to define HTML headings of HTML contents. Heading tags have 6 levels in HTML that is from <h1> to <h6>. <h1> is the largest heading and <h6> is the smallest. Heading tags in HTML also puts gaps between headings and other contents same as paragraph tag. Attributes of heading tags in HTML are:
  • Align: This attribute is used to the content written under headings content It has four values called right, left center, justify.
  • Title: This attribute is used to put a title for headings content that is visible on mouse over of that content.
<pre> Tag
<pre> tag in HTML stands for preformatted tag. The <pre> tag in HTML is used to define the block of preformatted text which preserves the text spaces, line breaks, tabs, and other formatting characters which are ignored by web browsers. Text in the <pre> element is displayed in a fixed-width font, but it can be changed using CSS. The <pre> tag requires a starting and end tag. As we type the code in text editor in the same way it display in web browser.

It is widely used to display language examples e.g. Java, C#, C, C++ etc because it displays the code as it is typed.

Example



<!DOCTYPE html>
<html>
<head>
<title>
HTML space management tags</title>
</head>
<body>

I am &nbsp;&nbsp; symbol to put space between words
<br> this is line break tag

<blockquote> I am used to indent content</blockquote>


<blockquote> <blockquote> I am used to indent content and nested content</blockquote>
</blockquote>

<p>
I am paragraph default aligned to left.
</p>


<p align="center">
I am paragraph aligned to center
</p>


<p align="center">
I am justified aligned paragraph.<br>

This tag is used to define a paragraph. To put the content in a new paragraph we use this tag. <p> Tag puts a gap between two paragraphs OR HTML contents equal to 2 <br> tags.
</p>
</body>
</html>
HTML space management tags I am    symbol to put space between words
this is line break tag
I am used to indent content
I am used to indent content and nested content

I am paragraph default aligned to left.

I am paragraph aligned to center

I am justified aligned paragraph.
This tag is used to define a paragraph. To put the content in a new paragraph we use this tag.

Tag puts a gap between two paragraphs OR HTML contents equal to 2
tags.



Example



<!DOCTYPE html>
<html>
<head>
<title>HTML space management tags</title>
</head>
<body>

<h1>
I am heading default aligned to left.
</h1>

<pre>
I am text

Under
pre tag
</pre>


<h1 align="center">
I am heading aligned to center.
</h1>

<pre>
Pre tag example 2

<b>Name Roll Fee</b>
Manish Kumar 5 570
Kunal Mishra 12 867
</pre>

<h1>
I am heading 1.
</h1>

<h2>
I am heading 2.
</h2>

<h3>
I am heading 3.
</h3>

<h4>
I am heading 4.
</h4>

<h5>
I am heading 5.
</h5>


<h6>
I am heading 6.
</h6>

</body>
</html>
HTML space management tags

I am heading default aligned to left.

I am       text

   Under
        pre tag

I am heading aligned to center.

Pre tag example 2

Name             Roll     Fee
Manish Kumar        5        570
Kunal Mishra        12       867

I am heading 1.

I am heading 2.

I am heading 3.

I am heading 4.

I am heading 5.
I am heading 6.