HTML
HTML stands for hypertext markup language.
Hypertext means ordinary text that has been dressed up with some extra features such as
formatting images, multimedia, and links to other document.
Markup means ordinary text adding with extra symbol such as editor proof reading
symbol.
Advantages of HTML
• For creating html document you need only text editor. No special software is
required.
Eg:- notepad.
• Html is platform independent means html document can be created on any
hardware.
• Finding error is easy in html.
• Html does not cost you anything for its use.
• There are no expensive licenses to buy or no upgrades to purchase.
• You can work independently.
• You need not to worry about editing programs.
• You will have a much better concept of the structure of your page and
understanding of why it works.
• Learning html is simple than any other programming language.
Disadvantages of HTML
• Html is not a programming language.
• Any simple calculation cannot be done in html.
• It cannot display even date.
• Also interactive web pages cannot be built by html.
• The web pages developed in html cannot behave like an application.
• The web pages developed in html do not have their own interface.
• Hyper link provided in html but for that we need a trip to server at each step.
Tag
• It is unit of markup.
• It is set of symbols defines in html to have special meaning.
• Html tags start with a less than sign(<) followed by keywords and ends with greater
than sign(>).
These symbols are also called as angle bracket.
• The tags are not displayed in web browser but their effect is displayed.
Syntax:- <keyword>
Eg:- <html>
• There are two types of tags
1. Start tag
2. End tag
1. Start tag:-
It is used to start an effect of tag. Eg:- <html>
, 2. End tag:-
End tag repeat the keyword with forward slash(/). It is used to end an effect of tag.
Eg:- </html>
Nesting of tags
Nesting of tag means tag within tag. Tags can be nested within each other.
Eg:- <b><i>computer science</i></b>
In above example observe that italic tag completely within bold tag.
Tag Attribute
Attribute is a keyword separated by a space within angle bracket.
It affect on behavior of tag.
Eg:- <hr no shade>
Some attributes require a value preceded by an equal sign.
Eg:- <p align=”left”>
Essentials of a web page
Every web page needs eight html tags. That are:
1. <Html>
It is used to display web page in web browser.
The document enclosed within starting tag <html> and closing tag </html>
2. <head>
It defines the header area of page, which is not displayed within page itself.
It supports to <title> tag.
It having starting tag <head> and closing tag </head>
3. <title>
It is used to give title to web page which is displayed in the title bar of the web
browser.
It having starting tag <title> and closing tag </title>
4. <body>
It is used to display actual content of the web page.
It having starting tag <body> and closing tag </body>
Structure of html web page/ Structure of html document
<html>
<head>
<title>
Title of the web page
</title>
</head>
<body>
Actual content of the web page
</body>
</html>
, Html tags
➢ <p> tag (paragraph)
It is used to create paragraph on web page.
The data enclosed within starting tag <p> and ending tag </p>.
Eg:- 1. <p>computer science </p>
O/P:-
computer science
2. <p>this is first paragraph </p><p>this is second paragraph</p>
O/P:-
this is first paragraph
this is second paragraph
• Attributes
1. align:-
It allows you to specify where the text or data appear on screen.
There are three alignments left, center and right.
Eg:- <p align=”right”>computer science</p>
O/P:-
computer science
➢ <br> tag (break line)
It is used to break the line.
It does not have closing or ending tag.
Eg:- <p>this is first line<br>this is second line</p>
O/P:-
this is first line
this is second line
• Attributes
1. clear all:-
It is used only with image tag.
It allows you to clear data appears next to image.
Eg:- <img src=”image path”><br clear all>
Eg:- <img src=”C:\Users\Public\Pictures\SamplePictures\Tulips.jpg”><br>Tulip
flower.
O/P:-
Tulip flower
Eg:- <img src=”C:\Users\Public\Pictures\SamplePictures\Tulips.jpg”><br clear
all>Tulip flower.
O/P:-
Tulip flower
HTML stands for hypertext markup language.
Hypertext means ordinary text that has been dressed up with some extra features such as
formatting images, multimedia, and links to other document.
Markup means ordinary text adding with extra symbol such as editor proof reading
symbol.
Advantages of HTML
• For creating html document you need only text editor. No special software is
required.
Eg:- notepad.
• Html is platform independent means html document can be created on any
hardware.
• Finding error is easy in html.
• Html does not cost you anything for its use.
• There are no expensive licenses to buy or no upgrades to purchase.
• You can work independently.
• You need not to worry about editing programs.
• You will have a much better concept of the structure of your page and
understanding of why it works.
• Learning html is simple than any other programming language.
Disadvantages of HTML
• Html is not a programming language.
• Any simple calculation cannot be done in html.
• It cannot display even date.
• Also interactive web pages cannot be built by html.
• The web pages developed in html cannot behave like an application.
• The web pages developed in html do not have their own interface.
• Hyper link provided in html but for that we need a trip to server at each step.
Tag
• It is unit of markup.
• It is set of symbols defines in html to have special meaning.
• Html tags start with a less than sign(<) followed by keywords and ends with greater
than sign(>).
These symbols are also called as angle bracket.
• The tags are not displayed in web browser but their effect is displayed.
Syntax:- <keyword>
Eg:- <html>
• There are two types of tags
1. Start tag
2. End tag
1. Start tag:-
It is used to start an effect of tag. Eg:- <html>
, 2. End tag:-
End tag repeat the keyword with forward slash(/). It is used to end an effect of tag.
Eg:- </html>
Nesting of tags
Nesting of tag means tag within tag. Tags can be nested within each other.
Eg:- <b><i>computer science</i></b>
In above example observe that italic tag completely within bold tag.
Tag Attribute
Attribute is a keyword separated by a space within angle bracket.
It affect on behavior of tag.
Eg:- <hr no shade>
Some attributes require a value preceded by an equal sign.
Eg:- <p align=”left”>
Essentials of a web page
Every web page needs eight html tags. That are:
1. <Html>
It is used to display web page in web browser.
The document enclosed within starting tag <html> and closing tag </html>
2. <head>
It defines the header area of page, which is not displayed within page itself.
It supports to <title> tag.
It having starting tag <head> and closing tag </head>
3. <title>
It is used to give title to web page which is displayed in the title bar of the web
browser.
It having starting tag <title> and closing tag </title>
4. <body>
It is used to display actual content of the web page.
It having starting tag <body> and closing tag </body>
Structure of html web page/ Structure of html document
<html>
<head>
<title>
Title of the web page
</title>
</head>
<body>
Actual content of the web page
</body>
</html>
, Html tags
➢ <p> tag (paragraph)
It is used to create paragraph on web page.
The data enclosed within starting tag <p> and ending tag </p>.
Eg:- 1. <p>computer science </p>
O/P:-
computer science
2. <p>this is first paragraph </p><p>this is second paragraph</p>
O/P:-
this is first paragraph
this is second paragraph
• Attributes
1. align:-
It allows you to specify where the text or data appear on screen.
There are three alignments left, center and right.
Eg:- <p align=”right”>computer science</p>
O/P:-
computer science
➢ <br> tag (break line)
It is used to break the line.
It does not have closing or ending tag.
Eg:- <p>this is first line<br>this is second line</p>
O/P:-
this is first line
this is second line
• Attributes
1. clear all:-
It is used only with image tag.
It allows you to clear data appears next to image.
Eg:- <img src=”image path”><br clear all>
Eg:- <img src=”C:\Users\Public\Pictures\SamplePictures\Tulips.jpg”><br>Tulip
flower.
O/P:-
Tulip flower
Eg:- <img src=”C:\Users\Public\Pictures\SamplePictures\Tulips.jpg”><br clear
all>Tulip flower.
O/P:-
Tulip flower
