Paragraphs (<p>) html tag
In HTML web page, <p> paragraph tag is used to create new web page paragraph or paragraph section. Where paragraph tag is a popular and important HTML tag to structure the text content information displayed on your web page by dividing it into paragraph or paragraph section order.
So let’s see multiple paragraph tag example in HTML web page.
Basic use of HTML paragraph tag.
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<title>Html Paragraph Tag Example</title>
</head>
<body>
<p>Today we tray to learn html paragraph tag, how to use apply and control its features in html </p>
</body>
</html>
A new paragraph, section, or web page text in general is created and displayed using <p> paragraph tag in any HTML file or web page. Modern web browsers automatically create or adjust the space at the top and bottom of the HTML <p> tag element text. This allows multiple tags in HTML web page to be previewed in preview order separately from other tags and with proper space.
HTML Multiple Paragraph Tag.
To create multiple paragraph text in an HTML web page or to create multiple web page text paragraph sections, use multiple <p> paragraph tags more than once in an HTML web page. Where your modern web browser automatically adjusts paragraph space in top, bottom, left, order for each <p> paragraph tag when displayed in a web page. And multiple paragraph tags generate multiple paragraph blocks in a single web page.
HTML web page multiple paragraphs example.
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<title>Html Multiple Paragraphs Tag Example</title>
</head>
<body>
<p>This is paragraph tag first example</p>
<p>This is paragraph tag second example, here we create a another paragraph tag to write more text</p>
<p>This is paragraph tag third example, similarly above it is also another paragraph tag which allow you to create more paragraph text</p>
</body>
</html>
Formatting HTML web page paragraphs.
Remember that <p> paragraph tag in HTML web page supports default formatting, where the top, bottom, left and right space, paragraph margins, indentation, etc. used in paragraph tag are automatically adjusted in the web browser. Apart from this, you can use CSS stylesheet scripts to further style and format HTML paragraphs.
Styling paragraphs with CSS in HTML example.
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<title> Paragraphs Tag with Css Example</title>
<style>
p {
color: red;
font-family: monotype corsiva;
font-size: 1.5em;
line-height: 1;
margin-bottom: 1em;
}
h1
{
color: brown;
font-family: times new roman;
font-size: 1.5em;
line-height: 1;
margin-bottom: 1em;
}
</style>
</head>
<body>
<p>let create a simple css stylesheet paragraph that shows font color, font face, size and other attributes </p>
<h1>heading 1 css properties explain with multiple css stylesheet attributes. </h1>
</body>
</html>
About HTML Paragraph Usage.
- Paragraph spaces management – HTML paragraph <p> tag automatically adjusts all-side spaces and margins in web page display, so whenever you create an HTML paragraph section, it automatically adjusts on all sides.
- Paragraph nesting – Never create/write paragraph nesting <p> tags inside other <p> tags in HTML web pages or nest them, as this may disrupt your default paragraph tag display order. Additionally, if you need to display additional elements within a paragraph tag section, you can apply HTML inline elements like <span> or <a>.
- Paragraph text alignment – Use CSS stylesheet properties like text-align to align HTML paragraph section text.
Paragraph line breaks.
If you need to create multiple paragraph line breaks within your HTML paragraph text, you can use CSS stylesheet properties like text-align. Or if you want to break a single paragraph into multiple lines, you can use the HTML br tag. The br tag helps you create a new paragraph in an HTML paragraph section or move the text from the br tag to the next line without starting a new paragraph in the HTML web page.
Line break within an HTML paragraph example.
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<title>Html Line Breaks Tag Example</title>
</head>
<body>
<p>Course <br>Html<br>Css<br>W3.css<br>Php<br>Javascript<br>Bootstrap</p>
</body>
</html>
In the above example, the <br> tag creates a line break within the paragraph, so the text after the <br> tag automatically starts on a new line, but remember this break text will be displayed within the same paragraph tag block.
