HTML Paragraphs

Next Page Previous Page

The tag <p> is used for defining a paragraph in HTML, when we run the program <p> adds a white space at the beginning of the line to showcase our paragraph on the browser.

Example :

<!DOCTYPE html>
<html>
<head>
<title>HTML Paragraph</title>
</head>
<body>

<p>Say hello to paragraph 1!</p>
<p>Say hello to paragraph 2!</p>

</body>
</html>

Related tags :

<pre>: tag pre referrers to the pre-formatted text in HTML document.

<hr>: adds a horizontal line on the page.

<br>: breaks the line.

Sometimes we don't know how our text will be displayed on our webpages because it always changes with the various types of screen sizes. How do we exactly tell our browser to showcase our text the way we want? Let’s understand with some examples.

Using <br> tag to break the lines

Example:

<!DOCTYPE html>
<html>
	<head>
		<title>HTML Paragraph</title>
	</head>
	<body>
		<p> This is a simple one line paragraph. </p>
		<br>
		<p>
			Here! i want to </br>
			Display my paragraph </br>
			In different lines <br>
		</p>
	</body>
</html>

Using <hr> tag to break the lines

Example: 

<!DOCTYPE html>
<html>
	<head>
		<title>HTML Paragraph</title>
	</head>
	<body>
		<p> This is a simple one line paragraph. </p>
		<hr> I Am adding a line break here!
		<p>
			Here! i want to </br>
			Display my paragraph </br>
			In different lines <br>
		</p>
	</body>
</html>

As we can see in the output browser displayed out text contents in a straight line.

Now! let's try something else,

Example : 

<!DOCTYPE html>
<html>
	<head>
		<title>HTML Paragraph</title>
	</head>
	<body>
		<p> so i want my first paragraph to displayed like a simple paragraph in html </p>
		<br>
		<pre>
		so as you can see using pre tag 
		I Can display my text 
		like this 
		and browser will understand it better.
		</pre>
	</body>
</html>
Next Page Previous Page

Treding Tutorial

Popular Tutorials

to Learn now