SlideShare a Scribd company logo
1 of 22
HTML
Dr. Lothe Savita A.
Department of Computer Science
Vasantrao Naik Mahavidyalaya, Aurangabad
Dr. Lothe Savita A. 1
Introduction
• Internet is a very large network of computers spread
across the world. The Internet allows for each of these
computers to send and receive information from each
other.
• One of the major applications of the Internet is the World
Wide Web (WWW). The World Wide Web or the web in
short, can be thought of as an interconnected set of
documents, images, audio, video files or software files.
Dr. Lothe Savita A. 2
Cont...
• When you connect to the Internet and look around (we
call it browsing), you are using a very interesting feature
of the web, hyperlinks.
• Each time you click on a highlighted piece of text or
image, you jump to another piece of text or image and this
could be on the same page, another page on the same
hard disk or on a page residing on another computer, half
way across the world. How it works??????????
Dr. Lothe Savita A. 3
What is HTML?
• HTML stands for Hyper Text Markup Language. It
is used to design web pages using markup
language.
• HTML is the combination of Hypertext and
Markup language.
• Hypertext defines the link between the web
pages.
• Markup language is used to define the text
document within tag which defines the structure
of web pages.
Dr. Lothe Savita A. 4
Cont.…
• This language is used to annotate (make notes for the
computer) text so that a machine can understand it and
manipulate text accordingly.
• Most of markup (e.g. HTML) languages are human
readable. Language uses tags to define what
manipulation has to be done on the text.
• HTML was created by Tim Berners-Lee in 1991.
• The first ever version of HTML was HTML 1.0 but the first
standard version was HTML 2.0 which was published in
1999.
Dr. Lothe Savita A. 5
Cont.…
• "Hypertext" refers to links that connect web pages to one
another, either within a single website or between
websites. Links are a fundamental aspect of the Web. By
uploading content to the Internet and linking it to pages
created by other people, you become an active participant
in the World Wide Web.
• HTML uses "markup" to annotate text, images, and other
content for display in a Web browser. HTML markup
includes special "elements" such
as <head>, <title>, <body>.
Dr. Lothe Savita A. 6
Important:
• HTML is the standard markup language for creating Web
pages.
• HTML stands for Hyper Text Markup Language
• HTML describes the structure of a Web page
• HTML consists of a series of elements
• HTML elements tell the browser how to display the
content
• HTML elements are represented by tags
• HTML tags label pieces of content such as "heading",
"paragraph", "table", and so on
• Browsers do not display the HTML tags, but use them to
render the content of the page.
Dr. Lothe Savita A. 7
Features of HTML:
• It is easy to learn and easy to use.
• It is platform independent.
• Images, video and audio can be added to a web page.
• Hypertext can be added to text.
• It is a markup language.
Dr. Lothe Savita A. 8
Cont.…
• Advantages:
• HTML is used to build a websites.
• It is supported by all browsers.
• It can be integrated with other languages like CSS,
JavaScript etc.
• Disadvantages:
• HTML can create only static webpages so for dynamic
web page other languages have to be used.
• Large amount of code has to be written to create a simple
web page.
• Security feature is not good.
Dr. Lothe Savita A. 9
Versions of HTML
HTML VERSION YEAR
HTML 1.0 1991
HTML 2.0 1995
HTML 3.2 1997
HTML 4.01 1999
XHTML 2000
HTML 5 2014
Dr. Lothe Savita A. 10
HTML BLOCK
Dr. Lothe Savita A. 11
Dr. Lothe Savita A. 12
Cont.…
• <DOCTYPE! html>: This tag is used to tells the HTML version. This
currently tells that the version is HTML 5.
• <html>: This is called HTML root element and used to wrap all the
code.
• <head>: Head tag contains metadata, title, page CSS etc. All the
HTML elements that can be used inside the <head> element are:
<style>
<title>
<base>
<noscript>
<script>
<meta>
<title>
• <body>: Body tag is used to enclosed all the data which a web page
has from texts to links. All of the content that you see rendered in the
browser is contained within this element.
•
Dr. Lothe Savita A. 13
HTML | Attributes
• An attribute is used to provide extra or additional
information about an element.
• All HTML elements can have attributes. Attributes provide
additional information about an element.
• It takes two parameters : a name and a value.
• Syntax:
• <element attribute_name="attribute_value">
Dr. Lothe Savita A. 14
Cont.…
• These define the properties of the element and is placed
inside the opening tag of the element. The name
parameter takes the name of the property we would like to
assign to the element and the value takes the properties
value or extent of the property names that can be aligned
over the element.
• Every name has some value that must be written within
quotes.
Dr. Lothe Savita A. 15
HTML Headings
• These tags help us to give headings to the
content of a webpage. These tags are
mainly written inside the body tag. HTML
provides us with six heading tags
from <h1> to <h6>. Every tag displays the
heading in a different style and font size.
Dr. Lothe Savita A. 16
Example
<html>
<head>
<title>GeeksforGeeks</title>
</head>
<body>
<h1>Hello Friends</h1>
<h2>Hello Friends</h2>
<h3>Hello Friends</h3>
<h4>Hello Friends</h4>
<h5>Hello Friends</h5>
<h6>Hello Friends</h6>
</body>
</html>
Dr. Lothe Savita A. 17
HTML Paragraph
These tags help us to write paragraph statements in a
webpage. They start with the <p>tag and ends with <p>.
Here the <br> tag is used to break line and acts as a
carriage return. <br> is an empty tag.
Dr. Lothe Savita A. 18
<html>
<head>
<title>B.Sc. Second Year</title>
</head>
<body>
<h1>Hello Friends</h1>
<p>
Department of Computer Science<br>
Vasantrao Naik Mahavidyalaya,<br>
Aurangabad<br>
</p>
</body>
</html>
Dr. Lothe Savita A. 19
HTML Horizontal Lines
The <hr> tag is used to break the page into
various parts, creating horizontal margins
with help of a horizontal line running from
left to right hand side of the page. This is
also an empty tag and doesn’t take any
additional statements.
Dr. Lothe Savita A. 20
<html>
<head>
<title>B.Sc. Second Year</title>
</head>
<body>
<h1>Hello Friends</h1>
<p>
Department of Computer Science<br>
Vasantrao Naik Mahavidyalaya,<br>
Aurangabad<br>
</p> <hr> <p>
Department of Computer Science<br>
Vasantrao Naik Mahavidyalaya,<br>
Aurangabad<br>
</p> <hr> <p>
Department of Computer Science<br>
Vasantrao Naik Mahavidyalaya,<br>
Aurangabad<br>
</p>
<hr>
</body>
</html>
Dr. Lothe Savita A. 21
Thank you
Continued in next Presentation
Dr. Lothe Savita A. 22

More Related Content

What's hot

How the internet_works
How the internet_worksHow the internet_works
How the internet_works
arun nalam
 

What's hot (20)

Internet and its effects
Internet and its effectsInternet and its effects
Internet and its effects
 
INTERNET WORKING AND ITS FEATURES
INTERNET WORKING AND ITS FEATURESINTERNET WORKING AND ITS FEATURES
INTERNET WORKING AND ITS FEATURES
 
introduction to Web system
introduction to Web systemintroduction to Web system
introduction to Web system
 
Introduction to the Internet
Introduction to the InternetIntroduction to the Internet
Introduction to the Internet
 
PST SC015 Chapter 3 Internet Technology (II) 2017/2018
PST SC015 Chapter 3 Internet Technology (II)  2017/2018PST SC015 Chapter 3 Internet Technology (II)  2017/2018
PST SC015 Chapter 3 Internet Technology (II) 2017/2018
 
what is internet
what is internetwhat is internet
what is internet
 
Internet
InternetInternet
Internet
 
How the internet_works
How the internet_worksHow the internet_works
How the internet_works
 
Slides 1 - Internet and Web
Slides 1 - Internet and WebSlides 1 - Internet and Web
Slides 1 - Internet and Web
 
Introduction to internet
Introduction to internetIntroduction to internet
Introduction to internet
 
World Wide Web (WWW) Technology
World Wide Web (WWW) TechnologyWorld Wide Web (WWW) Technology
World Wide Web (WWW) Technology
 
Internet features (2nd topic)
Internet features (2nd topic)Internet features (2nd topic)
Internet features (2nd topic)
 
Basics of internet, intranet, e mail,
Basics of internet, intranet, e mail,Basics of internet, intranet, e mail,
Basics of internet, intranet, e mail,
 
Web Technology UPTU UNIT 1
Web Technology UPTU UNIT 1 Web Technology UPTU UNIT 1
Web Technology UPTU UNIT 1
 
Intro to internet 1
Intro to internet 1Intro to internet 1
Intro to internet 1
 
PST SC015 Chapter 3 Internet Technology (IV) 2017/2018
PST SC015 Chapter 3 Internet Technology (IV)  2017/2018PST SC015 Chapter 3 Internet Technology (IV)  2017/2018
PST SC015 Chapter 3 Internet Technology (IV) 2017/2018
 
Internet
InternetInternet
Internet
 
Web
Web Web
Web
 
What is internet
What is internetWhat is internet
What is internet
 
PST SC015 Chapter 3 Internet Technology (I) 2017/2018
PST SC015 Chapter 3 Internet Technology (I)  2017/2018PST SC015 Chapter 3 Internet Technology (I)  2017/2018
PST SC015 Chapter 3 Internet Technology (I) 2017/2018
 

Similar to Introduction html

Similar to Introduction html (20)

Html Concept
Html ConceptHtml Concept
Html Concept
 
Grade 7_HTML.pptx
Grade 7_HTML.pptxGrade 7_HTML.pptx
Grade 7_HTML.pptx
 
introdution-to-html.ppt coding programming
introdution-to-html.ppt coding programmingintrodution-to-html.ppt coding programming
introdution-to-html.ppt coding programming
 
Introduction to html
Introduction to htmlIntroduction to html
Introduction to html
 
Grade 10 COMPUTER
Grade 10 COMPUTERGrade 10 COMPUTER
Grade 10 COMPUTER
 
Html
HtmlHtml
Html
 
Html.pptx
Html.pptxHtml.pptx
Html.pptx
 
Iwt module 1
Iwt  module 1Iwt  module 1
Iwt module 1
 
Html
HtmlHtml
Html
 
wt mod1.pdf
wt mod1.pdfwt mod1.pdf
wt mod1.pdf
 
WT Module-1.pdf
WT Module-1.pdfWT Module-1.pdf
WT Module-1.pdf
 
Web development using HTML and CSS
Web development using HTML and CSSWeb development using HTML and CSS
Web development using HTML and CSS
 
WHAT IS HTML.pdf
WHAT IS HTML.pdfWHAT IS HTML.pdf
WHAT IS HTML.pdf
 
WHAT IS HTML.pdf
WHAT IS HTML.pdfWHAT IS HTML.pdf
WHAT IS HTML.pdf
 
WHAT IS HTML.pdf
WHAT IS HTML.pdfWHAT IS HTML.pdf
WHAT IS HTML.pdf
 
Module 3
Module 3Module 3
Module 3
 
Basics of HTML..pptx
Basics of HTML..pptxBasics of HTML..pptx
Basics of HTML..pptx
 
Web forms and html (lect 1)
Web forms and html (lect 1)Web forms and html (lect 1)
Web forms and html (lect 1)
 
Module 5 and 6
Module 5 and 6Module 5 and 6
Module 5 and 6
 
uptu web technology unit 2 html
uptu web technology unit 2 htmluptu web technology unit 2 html
uptu web technology unit 2 html
 

More from savitamhaske (8)

Specialized estimation tech
Specialized estimation techSpecialized estimation tech
Specialized estimation tech
 
8086 microprocessor
8086 microprocessor8086 microprocessor
8086 microprocessor
 
Tables
TablesTables
Tables
 
Operators in c programming
Operators in c programmingOperators in c programming
Operators in c programming
 
Introduction to toc and compiler
Introduction to toc and compilerIntroduction to toc and compiler
Introduction to toc and compiler
 
Function in c
Function in cFunction in c
Function in c
 
Decision control and iterative statements
Decision control and iterative statementsDecision control and iterative statements
Decision control and iterative statements
 
Programming in C- Introduction
Programming in C- IntroductionProgramming in C- Introduction
Programming in C- Introduction
 

Recently uploaded

Transparency, Recognition and the role of eSealing - Ildiko Mazar and Koen No...
Transparency, Recognition and the role of eSealing - Ildiko Mazar and Koen No...Transparency, Recognition and the role of eSealing - Ildiko Mazar and Koen No...
Transparency, Recognition and the role of eSealing - Ildiko Mazar and Koen No...
EADTU
 

Recently uploaded (20)

AIM of Education-Teachers Training-2024.ppt
AIM of Education-Teachers Training-2024.pptAIM of Education-Teachers Training-2024.ppt
AIM of Education-Teachers Training-2024.ppt
 
Interdisciplinary_Insights_Data_Collection_Methods.pptx
Interdisciplinary_Insights_Data_Collection_Methods.pptxInterdisciplinary_Insights_Data_Collection_Methods.pptx
Interdisciplinary_Insights_Data_Collection_Methods.pptx
 
Python Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docxPython Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docx
 
COMMUNICATING NEGATIVE NEWS - APPROACHES .pptx
COMMUNICATING NEGATIVE NEWS - APPROACHES .pptxCOMMUNICATING NEGATIVE NEWS - APPROACHES .pptx
COMMUNICATING NEGATIVE NEWS - APPROACHES .pptx
 
Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)
 
Transparency, Recognition and the role of eSealing - Ildiko Mazar and Koen No...
Transparency, Recognition and the role of eSealing - Ildiko Mazar and Koen No...Transparency, Recognition and the role of eSealing - Ildiko Mazar and Koen No...
Transparency, Recognition and the role of eSealing - Ildiko Mazar and Koen No...
 
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
 
What is 3 Way Matching Process in Odoo 17.pptx
What is 3 Way Matching Process in Odoo 17.pptxWhat is 3 Way Matching Process in Odoo 17.pptx
What is 3 Way Matching Process in Odoo 17.pptx
 
Model Attribute _rec_name in the Odoo 17
Model Attribute _rec_name in the Odoo 17Model Attribute _rec_name in the Odoo 17
Model Attribute _rec_name in the Odoo 17
 
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...
 
How to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptxHow to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptx
 
Towards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptxTowards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptx
 
Simple, Complex, and Compound Sentences Exercises.pdf
Simple, Complex, and Compound Sentences Exercises.pdfSimple, Complex, and Compound Sentences Exercises.pdf
Simple, Complex, and Compound Sentences Exercises.pdf
 
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdfFICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
 
Graduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - EnglishGraduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - English
 
How to Add New Custom Addons Path in Odoo 17
How to Add New Custom Addons Path in Odoo 17How to Add New Custom Addons Path in Odoo 17
How to Add New Custom Addons Path in Odoo 17
 
Introduction to TechSoup’s Digital Marketing Services and Use Cases
Introduction to TechSoup’s Digital Marketing  Services and Use CasesIntroduction to TechSoup’s Digital Marketing  Services and Use Cases
Introduction to TechSoup’s Digital Marketing Services and Use Cases
 
Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...
Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...
Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...
 
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptxHMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
 
FSB Advising Checklist - Orientation 2024
FSB Advising Checklist - Orientation 2024FSB Advising Checklist - Orientation 2024
FSB Advising Checklist - Orientation 2024
 

Introduction html

  • 1. HTML Dr. Lothe Savita A. Department of Computer Science Vasantrao Naik Mahavidyalaya, Aurangabad Dr. Lothe Savita A. 1
  • 2. Introduction • Internet is a very large network of computers spread across the world. The Internet allows for each of these computers to send and receive information from each other. • One of the major applications of the Internet is the World Wide Web (WWW). The World Wide Web or the web in short, can be thought of as an interconnected set of documents, images, audio, video files or software files. Dr. Lothe Savita A. 2
  • 3. Cont... • When you connect to the Internet and look around (we call it browsing), you are using a very interesting feature of the web, hyperlinks. • Each time you click on a highlighted piece of text or image, you jump to another piece of text or image and this could be on the same page, another page on the same hard disk or on a page residing on another computer, half way across the world. How it works?????????? Dr. Lothe Savita A. 3
  • 4. What is HTML? • HTML stands for Hyper Text Markup Language. It is used to design web pages using markup language. • HTML is the combination of Hypertext and Markup language. • Hypertext defines the link between the web pages. • Markup language is used to define the text document within tag which defines the structure of web pages. Dr. Lothe Savita A. 4
  • 5. Cont.… • This language is used to annotate (make notes for the computer) text so that a machine can understand it and manipulate text accordingly. • Most of markup (e.g. HTML) languages are human readable. Language uses tags to define what manipulation has to be done on the text. • HTML was created by Tim Berners-Lee in 1991. • The first ever version of HTML was HTML 1.0 but the first standard version was HTML 2.0 which was published in 1999. Dr. Lothe Savita A. 5
  • 6. Cont.… • "Hypertext" refers to links that connect web pages to one another, either within a single website or between websites. Links are a fundamental aspect of the Web. By uploading content to the Internet and linking it to pages created by other people, you become an active participant in the World Wide Web. • HTML uses "markup" to annotate text, images, and other content for display in a Web browser. HTML markup includes special "elements" such as <head>, <title>, <body>. Dr. Lothe Savita A. 6
  • 7. Important: • HTML is the standard markup language for creating Web pages. • HTML stands for Hyper Text Markup Language • HTML describes the structure of a Web page • HTML consists of a series of elements • HTML elements tell the browser how to display the content • HTML elements are represented by tags • HTML tags label pieces of content such as "heading", "paragraph", "table", and so on • Browsers do not display the HTML tags, but use them to render the content of the page. Dr. Lothe Savita A. 7
  • 8. Features of HTML: • It is easy to learn and easy to use. • It is platform independent. • Images, video and audio can be added to a web page. • Hypertext can be added to text. • It is a markup language. Dr. Lothe Savita A. 8
  • 9. Cont.… • Advantages: • HTML is used to build a websites. • It is supported by all browsers. • It can be integrated with other languages like CSS, JavaScript etc. • Disadvantages: • HTML can create only static webpages so for dynamic web page other languages have to be used. • Large amount of code has to be written to create a simple web page. • Security feature is not good. Dr. Lothe Savita A. 9
  • 10. Versions of HTML HTML VERSION YEAR HTML 1.0 1991 HTML 2.0 1995 HTML 3.2 1997 HTML 4.01 1999 XHTML 2000 HTML 5 2014 Dr. Lothe Savita A. 10
  • 11. HTML BLOCK Dr. Lothe Savita A. 11
  • 13. Cont.… • <DOCTYPE! html>: This tag is used to tells the HTML version. This currently tells that the version is HTML 5. • <html>: This is called HTML root element and used to wrap all the code. • <head>: Head tag contains metadata, title, page CSS etc. All the HTML elements that can be used inside the <head> element are: <style> <title> <base> <noscript> <script> <meta> <title> • <body>: Body tag is used to enclosed all the data which a web page has from texts to links. All of the content that you see rendered in the browser is contained within this element. • Dr. Lothe Savita A. 13
  • 14. HTML | Attributes • An attribute is used to provide extra or additional information about an element. • All HTML elements can have attributes. Attributes provide additional information about an element. • It takes two parameters : a name and a value. • Syntax: • <element attribute_name="attribute_value"> Dr. Lothe Savita A. 14
  • 15. Cont.… • These define the properties of the element and is placed inside the opening tag of the element. The name parameter takes the name of the property we would like to assign to the element and the value takes the properties value or extent of the property names that can be aligned over the element. • Every name has some value that must be written within quotes. Dr. Lothe Savita A. 15
  • 16. HTML Headings • These tags help us to give headings to the content of a webpage. These tags are mainly written inside the body tag. HTML provides us with six heading tags from <h1> to <h6>. Every tag displays the heading in a different style and font size. Dr. Lothe Savita A. 16
  • 17. Example <html> <head> <title>GeeksforGeeks</title> </head> <body> <h1>Hello Friends</h1> <h2>Hello Friends</h2> <h3>Hello Friends</h3> <h4>Hello Friends</h4> <h5>Hello Friends</h5> <h6>Hello Friends</h6> </body> </html> Dr. Lothe Savita A. 17
  • 18. HTML Paragraph These tags help us to write paragraph statements in a webpage. They start with the <p>tag and ends with <p>. Here the <br> tag is used to break line and acts as a carriage return. <br> is an empty tag. Dr. Lothe Savita A. 18
  • 19. <html> <head> <title>B.Sc. Second Year</title> </head> <body> <h1>Hello Friends</h1> <p> Department of Computer Science<br> Vasantrao Naik Mahavidyalaya,<br> Aurangabad<br> </p> </body> </html> Dr. Lothe Savita A. 19
  • 20. HTML Horizontal Lines The <hr> tag is used to break the page into various parts, creating horizontal margins with help of a horizontal line running from left to right hand side of the page. This is also an empty tag and doesn’t take any additional statements. Dr. Lothe Savita A. 20
  • 21. <html> <head> <title>B.Sc. Second Year</title> </head> <body> <h1>Hello Friends</h1> <p> Department of Computer Science<br> Vasantrao Naik Mahavidyalaya,<br> Aurangabad<br> </p> <hr> <p> Department of Computer Science<br> Vasantrao Naik Mahavidyalaya,<br> Aurangabad<br> </p> <hr> <p> Department of Computer Science<br> Vasantrao Naik Mahavidyalaya,<br> Aurangabad<br> </p> <hr> </body> </html> Dr. Lothe Savita A. 21
  • 22. Thank you Continued in next Presentation Dr. Lothe Savita A. 22