Javatpoint Logo
Javatpoint Logo

How to add a Line in Html

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

  1. Using Html tag
  2. Using the Internal CSS

Using Html

If we want to add the Horizontal line in the Html document using Html tag, then we have to follow the steps which are given below. Using these steps, we can easily add the line:

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 horizontal line.

Step 2: Now, place the cursor at the point where we want to add the line in the Html document. And, then we have to use the <hr> tag of Html at that point.

Step 3: Now, we have to add the attributes of <hr> tag, which define the size, color and width of a line. So, we have to type the size, width, and color attribute within the <hr> tag.

Step 4: And, then we have to specify the values of these attributes.

Step 5: And, at last, we have to save the Html code and then run the file in the browser.

Test it Now

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

How to add a Line in Html

Using the Internal CSS

If we want to add the Horizontal line in the Html document using the Internal Stylesheet then we have to follow the steps which are given below. Using these steps, we can easily add the line:

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 horizontal line.

Step 2: Now, we have to place the cursor just after the closing of title tag 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 hr CSS tag for styling the horizontal line.

Step 3: Now, we have to define the attributes of hr CSS tag. So, we will define the different attributes in the following block:

Step 4: Now, we have to type the <hr> tag in the body of the Html document to show the horizontal line on the web page. And, at last, we have to save the Html file and then run the file in the Internet browser.

Test it Now

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

How to add a Line 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