WEB DESIGNING
Course :BCA
SemCourse :BCA
Semester :4th
Subject : WD
Faculty: Ms. Rubbina
Topic :HTML Commands
MOST COMMONLY USED TAGS IN
HTML
HTML contains lots of predefined tag. Some
of them are described below:
Document structure tag:
HTML tag: It is the root of the html
document which is used to specify that the
document is html.
Syntax:
<html> Statements... </html>
Head tag: Head tag is used to contain all the
head element in the html file. It contains the
title, style, meta, … etc tag.
Syntax:
<head> Statements... </head>
Body tag: It is used to define the body of
html document. It contains image, tables,
lists, … etc.
Syntax:
<body> Statements... </body>
Title tag: It is used to define the title of
html document.
Syntax:
<title> Statements... </title>
Heading tag: It is used to define the heading of
html document.
Syntax:
<h1> Statements... </h1>
<h2> Statements... </h2>
<h3> Statements... </h3>
<h4> Statements... </h4>
<h5> Statements... </h5>
<h6> Statements... </h6>
Paragraph tag: It is used to define paragraph
content in html document.
Syntax:
<p> Statements... </p>
HTML FORMATTING ELEMENTS
FORMATTING ELEMENTS WERE DESIGNED TO DISPLAY SPECIAL
TYPES OF TEXT:
<b> - Bold text
<strong> - Important text
<i> - Italic text
<em> - Emphasized text
<mark> - Marked text
<small> - Smaller text
<del> - Deleted text
<ins> - Inserted text
<sub> - Subscript text
<sup> - Superscript text
Emphasis tag: It is used to renders as
emphasized text.
Syntax:
<em> Statements... </em>
<em>GeeksforGeeks</em>
Bold tag: It is used to specify bold content in
html document.
Syntax:
<b> Statements... </b>
<b>Bold word</b>
Italic tag: It is used to write the content in
italic format.
Syntax:
<i> Statements... </i>
<i>GeeksforGeeks</i>
Small (text) tag: It is used to set the small
font size of the content.
Syntax:
<small> Statements... </small>
<small>Example</small>
Underline tag: It is used to set the content
underline.
Syntax:
<u> Statements... </u>
<u>GeeksforGeeks</u>
Deleted text tag: It is used to represent as
deleted text. It cross the text content.
Syntax:
<strike> Statements... </strike>
<strike>GeeksforGeeks</strike>
Anchor tag: It is used to link one page to
another page.
Syntax:
<a href="..."> Statements... </a>
<a href="https://www.geeksforgeeks.org/">
GeeksforGeeks</a>
List tag: It is used to list the content.
Syntax:
<li> Statements... </li>
<li>List item 1</li>
<li>List item 2</li>
Ordered List tag: It is used to list the content in
a particular order.
Syntax:
<ol> Statements... </ol>
<ol>
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
<li>List item 4</li>
</ol>
Unordered List tag: It is used to list the content
without order.
Syntax:
<ul> Statements... </ul>
<ul>
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
<li>List item 4</li>
</ul>
Center tag: It is used to set the content into
the center.
Syntax:
<center> Statements... </center>
<center>GeeksforGeeks</center>
Font tag: It is used to specify the font size,
font color and font-family in html document.
Syntax:
<font> Statements ... </font>
<font face="Times New
Roman">Example</font>
Empty (Non-Container) Tags:
Line break tag: It is used to break the line.
Syntax:
<br>
GeeksforGeeks<br>A computer science portal
Image tag: It is used to add image element in
html document.
Syntax:
<img>
<img src="gfg.jpg" width="40"
height="40" border="0">
Horizontal rule tag: It is used to display the
horizontal line in html document.
Syntax:
<hr/>
<hr width="50%" size="3" />
SUPERSCRIPT TEXT
The content of a <sup>...</sup> element is written in
superscript; the font size used is the same size as the
characters surrounding it but is displayed half a character's
height above the other characters.
Example
<!DOCTYPE html>
<html>
<head>
<title>Superscript Text Example</title>
</head>
<body>
<p>The following word uses a <sup>superscript</sup>
typeface.</p>
</body>
</html>
This will produce the following result −
The following word uses a superscript
typeface.
SUBSCRIPT TEXT
The content of a <sub>...</sub> element is written in
subscript; the font size used is the same as the
characters surrounding it, but is displayed half a
character's height beneath the other characters.
Example
<!DOCTYPE html>
<html>
<head>
<title>Subscript Text Example</title>
</head>
<body>
<p>The following word uses a <sub>subscript</sub>
typeface.</p>
</body>
</html>
This will produce the following result −
The following word uses a subscript typeface.
INSERTED TEXT
Anything that appears within <ins>...</ins> element
is displayed as inserted text.
Example
<!DOCTYPE html>
<html>
<head>
<title>Inserted Text Example</title> </head>
<body>
<p>I want to drink
<del>cola</del><ins>wine</ins></p>
</body>
</html>
LARGER TEXT
The content of the <big>...</big> element is
displayed one font size larger than the rest of the
text surrounding it as shown below −
Example
<!DOCTYPE html>
<html>
<head>
<title>Larger Text Example</title>
</head>
<body>
<p>The following word uses a <big>big</big>
typeface.</p>
</body>
</html>
This will produce the following result −
The following word uses a big typeface.
HTML <FOOTER> TAG
DEFINITION AND USAGE
The <footer> tag defines a footer for a document or
section.
A <footer> element typically contains:
authorship information
copyright information
contact information
sitemap
back to top links
related documents
You can have several <footer> elements in one
document.
EXAMPLE
<footer>
<p>Author: Hege Refsnes<br>
<a href="mailto:[email protected]">hege
@example.com</a></p>
</footer>
Y O U
TH ANK
