2. Introduction to HTML
• HTML stands for Hyper Text Markup Language
• Language interpreted by a web browser
• Web-pages are also called HTML Documents.
• It defines the structure and layout of a Web
document by using a variety of tags and
attributes.
www.eshikshak.co.in
3. Features of HTML
• Create a Web page using tags.
• Use graphics and display text in different fonts, sizes, and
color.
• Enhance the presentation of the document using HTML
elements.
• Create hyperlinks to navigate to different documents
present on the Web.
• Display data in a tabular format.
• Create multiple windows in a Web page to display
information from multiple sources in different windows
www.eshikshak.co.in
4. HTML tags
• A command inserted in a document that
specifies how the document, or a portion of
the document, should be formatted.
• HTML tags begin with an open angle bracket
(<) and end with a close angle bracket (>).
• HTML tags are of two types
– Paired Tags
– Singular Tags
www.eshikshak.co.in
5. HTML attributes
• A language construct that programmers use
to add additional information (i.e., metadata)
to code elements (e.g., assemblies, modules,
members, types, return values, and
parameters) to extend their functionality.
• Attributes are written immediately following
the tag
• Multiple attributes can be associated
www.eshikshak.co.in
6. Types of HTML tag – Paired tag
• A tag is said to be a paired tag if the text is
placed between a tag and its companion tag.
• In paired tags, the first tag is referred to as
Opening Tag and the second tag is referred to
as Closing Tag.
– Example: <i>This text is in italics. </i>
– Note: Here,
• <i> is called opening tag
• </i> is called closing tag.
www.eshikshak.co.in
7. Types of HTML tag – Singular tag
• A standalone tag does not have a companinon
tag.
– Example: <BR /> - This tag will insert a line break
– This tag does not require any companion tag.
www.eshikshak.co.in
8. The structure of HTML document
<html> This page is written in HTML
<head> Head tag contians information
<title> about web page
Title of the web page title tag contains
</title> title of a web page
</head>
body tag contains contents of
<body> web page
Content of the Page
<address> Your address </address> This is the footer of
the web page
</body>
</html>
www.eshikshak.co.in
9. The structure of HTML document
• The basic structure for all HTML documents is
simple and should include the following
minimum elements or tags:
– <html> : The main container for HTML pages
– <head> : The container for page header
information
– <title> : The title of the page
– <body> : The main body of the page
www.eshikshak.co.in
10. DOCTYPE
• The HTML !doctype tag is used for specifying
which version of HTML the document is using.
This is referred to as the document type
declaration (DTD).
• <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN“ "http://www.w3.
org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
www.eshikshak.co.in
11. The <html> Element
• The <html> element is the containing element
for the whole HTML document. Each HTML
document should have one <html> and each
document should end with a closing </html>
tag.
• Following two elements appear as direct
children of an <html> element:
– <head>
– <body>
www.eshikshak.co.in
12. The <head> Element
• The <head> element is just a container for all
other header elements.
• It should be the first thing to appear after the
opening <html> tag.
• Each <head> element should contain a <title>
element indicating the title of the document
www.eshikshak.co.in
13. The <head> Element
• The <title> tag is used to give title to the document.
• The <link> tag is used to link to an external file, such
as a style sheet or JavaScript file.
• The <style> tag is used to include CSS rules inside the
document.
• The <script> tag is used to include JAVAScript or
VBScript inside the document.
www.eshikshak.co.in
14. The <head> Element
• The <base> tag is used to create a "base" url for all
links on the page.
• The <object> tag is designed to include images,
JavaScript objects, Flash animations, MP3 files,
QuickTime movies and other components of a page.
www.eshikshak.co.in
15. The <title> Element:
• To specify a title for every page that you write
inside the <title> element.
• This element is a child of the <head> element.
• It is used in several ways:
– It displays at the very top of a browser window.
– It is used as the default name for a bookmark in
browsers such as IE and Netscape.
– Its is used by search engines that use its content
to help index pages.
www.eshikshak.co.in
16. The <title> Element:
• Here is the example of using title tag.
<html>
<head>
<title>Welcome to MyWebsite</title>
</head>
</html>
www.eshikshak.co.in
17. The <body> Element:
• The <body> element appears after the <head>
element.
• It contains the part of the Web page that you
actually see in the main browser window.
• A <body> element may contain anything from
a couple of paragraphs under a heading to
more complicated layouts containing forms
and tables.
www.eshikshak.co.in
18. The <body> Element:
• Here is the example of using body tag.
<html>
<head>
<title>Welcome to MyWebsite</title>
</head>
<body>
You are welcome to MyWebsite.
</body>
</html>
www.eshikshak.co.in