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>
Code:
<
html
>
<
head
>
<
title
>Title of your web page</
title
>
</
head
>
<
body
>HTML web page contents </
body
>
</
html
>
chevron_rightfilter_none -
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>
Code:
<
head
>Contains elements describing the document</
head
>
chevron_rightfilter_none -
Body tag: It is used to define the body of html document. It contains image, tables, lists, … etc.
Syntax:
<body> Statements... </body>
Code:
<
body
>The content of your HTML page</
body
>
chevron_rightfilter_none -
Title tag: It is used to define the title of html document.
Syntax:
<title> Statements... </title>
Code:
<
tittle
>tab name</
tittle
>
chevron_rightfilter_none
Content container tag:
-
Heading tag: It is used to define the heading of html document.
Syntax:
<h1> Statements... </h> <h2> Statements... </h2> <h3> Statements... </h3> <h4> Statements... </h4> <h5> Statements... </h5> <h6> Statements... </h6>
Code:
<
h1
>Heading 1 </
h1
>
<
h2
>Heading 2 </
h2
>
<
h3
>Heading 3 </
h3
>
<
h4
>Heading 4 </
h4
>
<
h5
>Heading 5 </
h5
>
<
h6
>Heading 6 </
h6
>
chevron_rightfilter_none -
Paragraph tag: It is used to define paragraph content in html document.
Syntax:
<p> Statements... </p>
Code:
<
p
>GeeksforGeeks: Computer science portal</
p
>
chevron_rightfilter_none -
Emphasis tag: It is used to renders as emphasized text.
Syntax:
<em> Statements... </em>
Code:
<
em
>GeeksforGeeks</
em
>
chevron_rightfilter_none -
Bold tag: It is used to specify bold content in html document.
Syntax:
<b> Statements... </b>
Code:
<
b
>Bold word</
b
>
chevron_rightfilter_none -
Italic tag: It is used to write the content in italic format.
Syntax:
<i> Statements... </i>
Code:
<
i
>GeeksforGeeks</
i
>
chevron_rightfilter_none -
Small (text) tag: It is used to set the small font size of the content.
Syntax:
<small> Statements... </small>
Code:
<
small
>Example</
small
>
chevron_rightfilter_none -
Underline tag: It is used to set the content underline.
Syntax:
<u> Statements... </u>
Code:
<
u
>GeeksforGeeks</
u
>
chevron_rightfilter_none -
Deleted text tag: It is used to represent as deleted text. It cross the text content.
Syntax:
<strike> Statements... </strike>
Code:
<
strike
>GeeksforGeeks</
strike
>
chevron_rightfilter_none -
Anchor tag: It is used to link one page to another page.
Syntax:
<a href="..."> Statements... </a>
Code:
GeeksforGeeks</
a
>
chevron_rightfilter_none -
List tag: It is used to list the content.
Syntax:
<li> Statements... </li>
Code:
<
li
>List item 1</
li
>
<
li
>List item 2</
li
>
chevron_rightfilter_none -
Ordered List tag: It is used to list the content in a particular order.
Syntax:
<ol> Statements... </ol>
Code:
<
ol
>
<
li
>List item 1</
li
>
<
li
>List item 2</
li
>
<
li
>List item 3</
li
>
<
li
>List item 4</
li
>
</
ol
>
chevron_rightfilter_none -
Unordered List tag: It is used to list the content without order.
Syntax:
<ul> Statements... </ul>
Code:
<
ul
>
<
li
>List item 1</
li
>
<
li
>List item 2</
li
>
<
li
>List item 3</
li
>
<
li
>List item 4</
li
>
</
ul
>
chevron_rightfilter_none -
Comment tag: It is used to set the comment in html document. It is not visible on the browser.
Syntax:
<!-- Statements... -->
Code:
<!--Comment section-->
chevron_rightfilter_none -
Scrolling Text tag: It is used to scroll the text or image content.
Syntax:
<marquee> Statements... </marquee>
Code:
<
marquee
bgcolor
=
"#cccccc"
loop
=
"-1"
scrollamount
=
"2"
width
=
"100%"
>
Example Marquee</
marquee
>
chevron_rightfilter_none -
Center tag: It is used to set the content into the center.
Syntax:
<center> Statements... </center>
Code:
<
center
>GeeksforGeeks</
center
>
chevron_rightfilter_none -
Font tag: It is used to specify the font size, font color and font-family in html document.
Syntax:
<font> Statements ... <font>
Code:
<
font
face
=
"Times New Roman"
>Example</
font
>
chevron_rightfilter_none
Empty (Non-Container) Tags:
-
Line break tag: It is used to break the line.
Syntax:
<br>
Code:
GeeksforGeeks<
br
>A computer science portal
chevron_rightfilter_none -
Image tag: It is used to add image element in html document.
Syntax:
<img>
Code:
<
img
src
=
"gfg.jpg"
width
=
"40"
height
=
"40"
border
=
"0"
>
chevron_rightfilter_none -
Link tag: It is used to link the content from external source.
Syntax:
<link>
Code:
<
head
>
<
link
rel
=
"stylesheet"
type
=
"text/css"
href
=
"style.css"
>
</
head
>
chevron_rightfilter_none -
Horizontal rule tag: It is used to display the horizontal line in html document.
Syntax:
<hr/>
Code:
<
hr
width
=
"50%"
size
=
"3"
/>
chevron_rightfilter_none -
Meta tag: It is used to specify the page description. For example: last modifier, authors, … etc.
Syntax:
<meta> Statements ... <meta>
Code:
<
meta
name
=
"Description"
content
=
"Description of your site"
>
<
meta
name
=
"keywords"
content
=
"keywords describing your site"
>
chevron_rightfilter_none
Tables Tags: Table tag is used to create a table in html document.
-
Table tag:
Syntax:
<table> Statements... </table>
Code:
<
table
border
=
"4"
cellpadding
=
"2"
cellspacing
=
"2"
width
=
"100%"
>
<
tr
> <
td
>Column 1</
td
>
<
td
>Column 2</
td
> </
tr
> </
table
>
chevron_rightfilter_none -
Tr tag: It is used to define row of html table.
Syntax:
<tr> Statements... </tr>
Code:
<
table
>
<
tr
>
<
th
>Month</
th
>
<
th
>Savings</
th
>
</
tr
>
<
tr
>
<
td
>January</
td
>
<
td
>$100</
td
>
</
tr
>
</
table
>
chevron_rightfilter_none -
Th tag: It defines the header cell in a table. By default it set the content with bold and center property.
Syntax:
<th> Statements ... <th>
Code:
<
table
>
<
tr
>
<
th
>Month</
th
>
<
th
>Savings</
th
>
</
tr
>
<
tr
>
<
td
>January</
td
>
<
td
>$100</
td
>
</
tr
>
</
table
>
chevron_rightfilter_none -
Td tag: It defines the standard cell in html document.
Syntax:
<td> Statements ... <td>
Code:
<
table
>
<
tr
>
<
td
>Cell A</
td
>
<
td
>Cell B</
td
>
</
tr
>
</
table
>
chevron_rightfilter_none
Input Tags:
-
Form tag: It is used to create html form for user.
Syntax:
<form> Statements ... <form>
Code:
<
form
action
=
"mailto:you@yourdomain.com "
>
Name: <
input
name
=
"Name"
value
=
""
size
=
"80"
><
br
>
Email: <
input
name
=
"Email"
value
=
""
size
=
"80"
><
br
>
<
br
><
center
><
input
type
=
"submit"
></
center
>
</
form
>
chevron_rightfilter_none -
Submit input tag: It is used to take the input from the user.
Syntax:
<input>
Code:
<
form
method
=
post
action
=
"/cgibin/example.cgi"
>
<
input
type
=
"text"
style="color: #ffffff;
font-family: Verdana; font-weight: bold;
fontsize: 12px; background-color: #72a4d2;"
size
=
"10"
maxlength
=
"30"
>
<
input
type
=
"Submit"
value
=
"Submit"
>
</
form
>
chevron_rightfilter_none -
Dropdown option tag: It is used to select an option froma drop-down list.
Syntax:
<option> Statements ... <option>
Code:
<
form
method
=
post
action
=
"/cgibin/example.cgi"
>
<
center
> Select an option:<
select
>
<
option
>option 1</
option
>
<
option
selected>option 2</
option
>
<
option
>option 3</
option
>
</
form
>
chevron_rightfilter_none -
Radio button tag: It is used to select only one option from the given options.
Syntax:
<input>
Code:
<
form
method
=
post
action
=
"/cgibin/example.cgi"
>
Select an option:<
br
>
<
input
type
=
"radio"
name
=
"option"
> Option 1
<
input
type
=
"radio"
name
=
"option"
checked> Option 2
<
input
type
=
"radio"
name
=
"option"
> Option 3
chevron_rightfilter_none