Scribd
Upload
3 views

Introduction to HTML

HTML, or HyperText Markup Language, is the standard language for creating and designing web pages, evolving from its introduction in 1991 to the latest version, HTML5. It consists of various elements and tags that define the structure and formatting of web content, including paired and unpaired tags, attributes, and text formatting options. Comments can also be added to HTML code for clarity, which are ignored by browsers.

Uploaded by

justthat710
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
3 views

Introduction to HTML

HTML, or HyperText Markup Language, is the standard language for creating and designing web pages, evolving from its introduction in 1991 to the latest version, HTML5. It consists of various elements and tags that define the structure and formatting of web content, including paired and unpaired tags, attributes, and text formatting options. Comments can also be added to HTML code for clarity, which are ignored by browsers.

Uploaded by

justthat710
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 5

Introduction to HTML

What is HTML?
HTML stands for HyperText Markup Language. It is the standard language used to create
and
design web pages on the internet. It was introduced by Tim Berners-Lee in 1991 at CERN as
a simple markup language. Since then, it has evolved through versions from HTML 2.0 to
HTML5 (the latest 2024 version).
HTML is a combination of Hypertext and Markup language. Hypertext defines the link
between the web pages and Markup language defines the text document within the tag.

The major points of HTML are given below:


● HTML stands for HyperText Markup Language.
● HTML is used to create web pages and web applications.
● HTML is widely used language on the web.
● We can create a static website by HTML only.
● Technically, HTML is a Markup language rather than a programming language.

A Simple HTML Document


<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>

Explained
● The <html> declaration defines that this document is an HTML document

● The <html> element is the root element of an HTML page

● The <head> element contains meta information about the HTML page

● The <title> element specifies a title for the HTML page (which is shown in the browser's
title bar or in the page's tab)

● The <body> element defines the document's body, and is a container for all the visible
contents, such as headings, paragraphs, images, hyperlinks, tables, lists, etc.

● The <h1> element defines a large heading

● The <p> element defines a paragraph


What Is an HTML Tag?
HTML tags are the keywords on a web page that define how your web browser must format
and display your web page.
Almost all tags contain two parts, an opening, and a closing tag. For example, <html> is the
opening tag and </html> is the closing tag. Note that the closing tag has the same text as the
opening tag, but has an additional forward-slash ( / ) character.

Basic HTML Tags


● Head Tag
The head tag <head> contains all the elements describing the document.

● Title Tag
The title tag <title> specifies the HTML page title, which is shown in the browser’s title bar.

● Body Tag
The body tag <body> is where you insert your web page’s content.

● Paragraph Tag
A paragraph tag <p> is used to define a paragraph on a web page.

● Heading Tag
The HTML heading tag is used to define the heading of the HTML document. The <h1> tag
defines the most important tag, and <h6> defines the least.

Types of Tags in HTML

Paired and Unpaired Tags


Following are the paired and unpaired tags in HTML explained in detail with the help of
examples.

1. Paired Tags
An HTML tag is known as a paired tag when the tag consists of an opening tag and a closing
tag as its companion tag. An HTML Paired tag starts with an opening tag: the tag name
enclosed inside the angle brackets; for example, a paragraph opening tag is written as ‘<p>’.
The content follows the opening tag, which ends with an ending tag: the tag name starting
with a forward slash; for example, an ending paragraph tag is written as ‘</p>’. The first tag
can be referred to as the ‘Opening Tag’, and the second tag can be called Closing Tag.

Example #1:
<p> This text is a paragraph . </p>

Example #2:
Another example of a paired tag is italic and/or bold tags:
<i> <b> This is a bold and italicized text </b> </i>

2. Unpaired Tags
An HTML tag is called an unpaired tag when the tag only has an opening tag and does not
have a closing tag or a companion tag. The Unpaired HTML tag does not require a closing
tag; an opening tag is sufficient in this type. Unpaired tags are sometimes also named as
Standalone Tags or Singular Tags since they do not require a companion tag.

Example:
<p> This is a paragraph </p>
<hr>
<b> This is a bold text </b>
<br>
<i> This is a italicized text </i>

Here, the <hr> and <br> is the unpaired tag. <hr> tag is used to create a horizontal line and
<br> tag is used to insert a line break within text, allowing e content to continue on the next
line.

Note: In older versions, you might see hr tag written as <hr/> instead of <hr>. These tags are
also called Empty Tag.

HTML Attributes

● HTML attributes are special words which provide additional information about the
elements or attributes are the modifier of the HTML element.

● Each element or tag can have attributes, which defines the behaviour of that
element.

● Attributes should always be applied with start tag.

● The Attribute should always be applied with its name and value pair.

● The Attributes name and values are case sensitive, and it should be written in
Lowercase only.

● You can add multiple attributes in one HTML element, but need to give space
between two attributes.

Example:
<body bgcolor=”green”>

Text formatting HTML tags:


Text formatting tags in HTML are used to apply styles and formatting to text, such as making
it bold, italic, underlined, or changing its size and color, helping control how the content is
displayed on a webpage.

1. Bold (<b> or <strong>)


The <b> tag is used to make text bold. The <strong> tag also makes text bold, but it adds
semantic meaning (indicating importance).

Example:

<b>This is bold text</b>


<strong>This is also bold text with semantic meaning</strong>

2. Italic (<i> or <em>)


The <i> tag makes text italic, while the <em> tag emphasizes text (usually also italicized).

Example:

<i>This is italic text</i>


<em>This is emphasized text</em>

3. Underline (<u>)
The <u> tag is used to underline text.

Example:

<u>This text is underlined</u>

4. Strike (<strike> or <s>)


The <strike> and <s> tags are used to apply a line through the text, indicating it has been
removed or is no longer relevant.

Example:

<strike>This text is struck through</strike>


<s>This is also struck through</s>

5. Superscript (<sup>)
The <sup> tag is used to display text as superscript (raised above the normal text).

Example:

E = mc<sup>2</sup>

6. Subscript (<sub>)
The <sub> tag is used to display text as subscript (lowered below the normal text).

Example:
H<sub>2</sub>O

7. Font Face (<font> with face attribute)


The <font> tag is used to change the font face (although it's now deprecated in favor of
CSS).

Example:

<font face="Arial">This text is in Arial font</font>

8. Font Color (<font> with color attribute)


The <font> tag can also be used to change the text color (nowadays, CSS is preferred for
styling).

Example:

<font color="blue">This text is blue</font>

9. Font Size (<font> with size attribute)


The <font> tag’s size attribute is used to change the text size. It's now recommended to use
CSS for font size control.

Example:

<font size="5">This text has font size 5</font>

Comments in HTML
The comment tag is used to insert a comment in the HTML source code. A comment will be
ignored by the browser. You can use comments to explain your code, which can help you
when
you edit the source code at a later date.
<!-- This is a comment →

Note: that you need an exclamation point after the opening bracket, but not before the
closing
bracket.

You might also like