Javatpoint Logo
Javatpoint Logo

How to add Space in Html

In HTML, we can easily add the space in the document using the following different ways:

  1. Using Html
  2. Using Internal CSS

Using Html

If we want to add the space in the document using Html tag to show the space before and after the text then we have to follow the steps which are given below. Using these steps, we can easily add the space:

Step 1: Firstly, we have to type the Html code in any text editor or open the existing Html file in the text editor in which we want to add the space.

Step 2: Now, place the cursor where we want to add the space. And, then we have to press the spacebar from the keyboard. Basically, web page shows only one space between the two words. It does not matter that how much we have pressed the spacebar.

Step 3: If we want to show more than one space before or after the text on the webpage then we have to give the following tag:

Step 4: If we want to insert/add the longer space then we also use the following tags for showing two or four spaces between the text on the web page:

Step 5: We can also add the <pre> tag, which displays the text on the web page as same as entered in the Html document.

Step 6: When we have added the space successfully in the document, then we have to save the Html file and run the file.

The output of above Html code is shown in the following screenshot:

How to add Space in Html

Using Internal CSS

If we want to add the space in the document using the Internal Cascading stylesheet to show the space before and after the text, we have to follow the steps which are given below. Using these steps, we can easily add the space.

Step 1: Firstly, we have to type the Html code in any text editor or open the existing Html file in the text editor in which we want to use the Internal CSS for adding the space.

Step 2: Now, we have to place the cursor in the head tag of the Html document and then define the styles inside the <style> tag as shown in the following block. And, then we have to type the text-indent attribute into the paragraph element.

Step 3: Now, we have to type the paragraph tag and the class tab1 in the <pre> tag of the Html. And, at last, we have to save the Html file and then run the file.

Test it Now

The output of the above Html code is shown in the following screenshot:

How to add Space in Html




Youtube For Videos Join Our Youtube Channel: Join Now

Help Others, Please Share

facebook twitter pinterest

Learn Latest Tutorials


Preparation


Trending Technologies


B.Tech / MCA