Headlines and Paragraphs in HTML for Beginners
In this Tutorial we are going to Cover all the Tags Related to Text in HTML.
Tags who controls Texts in HTML Web-page like Paragraphs tags, Headlines Tags and many more tags to Decorate the Texts inside HTML Web-page.
<p> Tag (Paragraph) in HTML:
Para tag “written as <p>” used in HTML to write paragraphs inside HTML Web-pages. We write p (p for Para/Paragraph) inside these “<” opening and “>” closing Brackets.
Like : <p>
Like other HTML tags This <p> Para Tag also has the Closing tag.
Whom we write as </p>
Para Starting Tag : <p>
Para Closing Tag : </p>
Writing a Paragraph inside HTML Document
To write a Paragraph inside a HTML Document we have to Create a HTML File.
After creating your HTML file. write Paragraph’s Starting and closing tags <p>……</p>inside Body’s <body>……</body> Starting Closing tags.
Like:
index.html
<body>
<p></p>
</body>
Inside the Paragraph’s starting and Closing tags <p>……</p> you have to write your Paragraph Data.
index.html
<html>
<head>
<title>HTML ParaGraph</title>
</head>
<body>
<p>
This is my First HTML Paragraph. we have to put our paraGraph's Content / data inside the Para's Starting and Closing tags.
</p>
</body>
</html>
Need a Personal Tutor?
I am here to help you with your Programming journey. HTML, CSS, JavaScript, ReactJS, NextJS, C, C++, C#, SQL and more.
Headlines in HTML
Headlines are used in HTML to declare some Impotent lines, Titles and Heading of Page or Paragraph.
In HTML Headlines are declared inside <h1> or <h6> tag’s starting and closing Tags.
Like:
<h1>My Headline</h1>
Headlines Tags in HTML
Headlines tags are little different then other HTML Tags. They do have starting and Closing Tags but they also have More then one tags for Headline.
They have Six Different headline Tags in HTML.
index.html
<h1>Headline 1</h1>
<h2>Headline 2</h2>
<h3>Headline 3</h3>
<h4>Headline 4</h4>
<h5>Headline 5</h5>
<h6>Headline 6</h6>
Different Headline Tags:
As we already know, there is Six Tags in HTML for Headlines. Those Six Headlines tags works the same (Used to Declare Headlines) but the Headline Text size/Font Size makes them Different from each other.
So the first Headline tag <h1> has the largest or biggest font Size among all other Headline Tags.
And
The last Headline Tag <h6> has the smallest font size Among all other Headline Tags.
Headlines Example
index.html
<html>
<head>
<title>HTML Headlines</title>
</head>
<body>
<p>
<h1> Headline 1 </h1>
<h2> Headline 2 </h2>
<h3> Headline 3 </h3>
<h4> Headline 4 </h4>
<h5> Headline 5 </h5>
<h6> Headline 6 </h6>
</p>
</body>
</html>
Need a Personal Tutor?
I am here to help you with your Programming journey. HTML, CSS, JavaScript, ReactJS, NextJS, C, C++, C#, SQL and more.
Text Formatting In HTML
In HTML we have Special Elements to Defining text with Special Meaning. Using those Special Element’s Tags we can Make our text Looks unique or has unique profile.
Tags Like:
Bold Element
italic Element
strong Element
Emphasized Element
Marked Element
Small Element
Delete Element
Underline Element
Subscript Element
Superscript Element
HTML Bold Element
HTML Bold Element written as <b> Defines Bold text. Make text little dark/Bold.
To make any Text Bold we only have to write that text Inside yhe Bold Element <b>
Like:
<b>This is My Bold Text<b>
index.html [HTML Bold Element]
<html>
<head>
<title>Bold Text</title>
</head>
<body>
<b> This text is bold </b> <br/>
This text is not bold
</body>
</html>
HTML Italic Element
HTML Italic Element written as <i> Defines Italic text. Make text little Cursive/Rotate.
To make any Text Italic we only have to write that text Inside the Italic Element <i>.
index.html
<i>This is My Bold Text</i>
HTML Italic Element Example:
index.html
<html>
<head>
<title>Italic Text</title>
</head>
<body>
<i> This text is italic </i> <br/>
This text is not italic
</body>
</html>
Need a Personal Tutor?
I am here to help you with your Programming journey. HTML, CSS, JavaScript, ReactJS, NextJS, C, C++, C#, SQL and more.
HTML Strong Element
Strong Element written as <strong> Defines Strong text. Make text little dark/Bold (Works like Bold Element).
To make any Text Strong we only have to write that text Inside the Strong Element<strong>.
index.html
<strong>This is My Bold Text</strong>
HTML Strong Element Example:
index.html
<html>
<head>
<title>strong text</title>
</head>
<body>
<strong> This text is strong </strong> <br/>
This text is not strong
</body>
</html>
HTML Emphasized Element
HTML Emphasized Element written as <em> Defines Italic text. Make text little Cursive/Italic. (Works Same as Italic Element)
To make any Text Emphasized we only have to write that text Inside yhe Emphasized Element <em>.
index.html
<em>This is My Emphasized Text</em>
HTML Emphasize Element Example:
index.html
<html>
<head>
<title>emphasize text</title>
</head>
<body>
<em> This text is emphasize </em> <br/>
This text is not emphasize
</body>
</html>
Need a Personal Tutor?
I am here to help you with your Programming journey. HTML, CSS, JavaScript, ReactJS, NextJS, C, C++, C#, SQL and more.
HTML Mark Element
Mark Element written as <b> Defines Marked or Highlighted text. This Element Makes text little Highlighted from Background with Different Color.
To make any Text Marked we only have to write that text Inside the Mark Element <mark>.
index.html
<mark>This is My Marked Text</mark>
HTML Mark Element Example:
index.html
<html>
<head>
<title>marked text</title>
</head>
<body>
<mark> This text is marked </mark> <br/>
This text is not marked
</body>
</html>
Small Element
HTML Small Element written as <small> Defines small text. This Element Makes text little small in Size.
To make any Text small we only have to write that text Inside the small Element <small>.
index.html
<small>This is My small Text</small>
HTML Small Element Example:
index.html
<html>
<head>
<title>small text</title>
</head>
<body>
<small> This text is small </small> <br/>
This text is not small
</body>
</html>
Need a Personal Tutor?
I am here to help you with your Programming journey. HTML, CSS, JavaScript, ReactJS, NextJS, C, C++, C#, SQL and more.
HTML Delete Element
HTML Delete Element written as <del> Defines Deleted text. This Element Draws a line through selected text.
To make any Text Deleted we only have to write that text Inside the Delete Element<del>.
index.html
<del>This is My Delete Text</del>
HTML delete Element Example:
index.html
<html>
<head>
<title>deleted text</title>
</head>
<body>
<delete> This text is deleted </delete> <br/>
This text is not deleted
</body>
</html>
HTML Underline Element
Underline Element written as <u> Defines Underlined text. This Element Draws a Underline at the bottom of the selected text.
To make any Text Underlined we only have to write that text Inside the Underline Element <u>.
index.html
<u>These are My Underlined Texts</u>
HTML Underline Element Example:
index.html
<html>
<head>
<title>underlined text</title>
</head>
<body>
<u> This text is underlined </u> <br/>
This text is not underlined
</body>
</html>
HTML Subscript Elements
Subscript Element written as <sub> Defines Subscript texts. Make text little small in size and reposition text from its Normal Position.
To make any Text Insert we only have to write that text Inside the Subscript Element<sub>.
index.html
<p> this is <sub>Subscripted</sub> text </p>
HTML Superscript Elements
Subscript Element written as <sup> Defines Subscripted texts. Make text little small in size and reposition text from its Normal Position (same like Subscripts but in the repositions texts in opposite direction).
To make any Text Superscripted we only have to write that text Inside the Superscript Element <sup>.
index.html
<p> this is <sup>Superscripted</sup> text </p>
HTML sub and super Script Example:
index.html
<html>
<head>
<title>sub and super Script</title>
</head>
<body>
normal text <sub> This text is sub Scripted </sub>
<br/>
normal text <sup> This text is sub Scripted </sup>
</body>
</html>
On This Page
Need a Personal Tutor?
I am here to help you with your Programming journey. HTML, CSS, JavaScript, ReactJS, NextJS, C, C++, C#, SQL and more.