SlideShare a Scribd company logo
What is HTML ?
HTML is the standard markup language for creating Web pages.
•HTML stands for Hyper Text Markup Language
•HTML describes the structure of Web pages using
markup
•HTML elements are the building blocks of HTML pages
NOTE := Browsers do not display the HTML tags, but use
them to render the content of the page
•HTML elements are represented by tags
BASIC STRUCTURE OF HTML
• <html> tag denotes that the
web page is written in HTML
• <head> tag contains
information about the web
page
• <body> tag contains the
content of the web page
• </html> denotes the end of
the web page
 All HTML documents must start with a document type
declaration: <!DOCTYPE html>.
 The HTML document itself begins with <html>
and ends with </html>.
 The visible part of the HTML document is
between <body> and </body>.
THINGS TO BE CONSIDERED
BASIC HTML ELEMENTS
1
2
3
Headings
Paragraph
Horizontal Rule
4 Line Break
An HTML element is an
individual component of an
HTML document or web page,
once this has been parsed into
the Document Object Model.
HTML ELEMENTS
1. BLOCK ELEMENTS
2. INLINE ELEMENTS
BLOCK INLINE
Block elements are those that
take up the full width
available on a web page.
Inline elements are those
who only take up as much
width as is needed to display
the contents of the element
Common block elements:
•Paragraphs (<p>)
•Headers (<h1> through <h6>)
•Lists and list items (<ol>, <ul>, and <li>)
•Forms (<form>)
Common inline elements
•Spans (<span>)
•Images (<img>)
•Anchors (<a>)
HTML Headings
• Headings are defined with the <h1> to <h6> tags.
• <h1> defines the most important heading.
• <h6> defines the least important heading.
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>
HTML Paragraphs
The HTML <p> element defines a paragraph
<p>
The quick brown fox jumps over the lazy dog
</p>
<p>
HTML Elements are the building blocks of HTML pages. With HTML constructs, images and other
objects such as interactive may be embedded into the rendered page. HTML provides a means to
create structured document by denoting structural semantics for text such as headings, paragraphs,
lists, links, quotes and other items. HTML elements are delineated by tags, written using angle
brackets. Tags such as <img /> and <input /> directly introduce content into the page. Other tags
such as <p> surround and provide information about document text and may include other tags as
sub-elements. Browsers do not display the HTML tags, but use them to interpret the content of the
page.
HTML can embed programs written in a scripting language such as JavaScript, which affects the
behavior and content of web pages. Inclusion of CSS defines the look and layout of content. The
World Wide Web Consortium (W3C), maintainer of both the HTML and the CSS standards, has
encouraged the use of CSS over explicit presentational HTML since 1997
</p>
• The HTML <br> element defines a line break.
HTML Line Breaks
• Use <br> if you want a line break (a new line)
without starting a new paragraph:
<p>
This is
<br>
a paragraph
<br>
with line
breaks.</p>
• The <hr> tag defines a thematic break in
an HTML page (e.g. a shift of topic).
• The <hr> element is used to separate
content (or define a change) in an HTML
page.
HTML Horizontal Breaks
<h1>HTML</h1>
<p>HTML is a language for describing web pages.....</p>
<hr>
<h1>CSS</h1>
<p>CSS defines how to display HTML elements.....</p>

More Related Content

What's hot

WEB PAGE DESIGN USING HTML
WEB PAGE DESIGN USING HTMLWEB PAGE DESIGN USING HTML
WEB PAGE DESIGN USING HTML
Sneha Mukherjee
 
HTML_Day_Two(W3Schools)
HTML_Day_Two(W3Schools)HTML_Day_Two(W3Schools)
HTML_Day_Two(W3Schools)
Rafi Haidari
 
Html_Day_One (W3Schools)
Html_Day_One (W3Schools)Html_Day_One (W3Schools)
Html_Day_One (W3Schools)
Rafi Haidari
 
Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTML
Ann Alcid
 
Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTML
Ameer Khan
 
Web Development - Lecture 2
Web Development - Lecture 2Web Development - Lecture 2
Web Development - Lecture 2
Syed Shahzaib Sohail
 
Html presantation
Html presantationHtml presantation
Html presantation
Adityaroy110
 
HTML Introduction
HTML IntroductionHTML Introduction
HTML Introduction
c525600
 
Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTML
Carson City Library
 
Html viva questions
Html viva questionsHtml viva questions
Html viva questions
Vipul Naik
 
Web designing using html
Web designing using htmlWeb designing using html
Web designing using html
julicris021488
 
Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTML
Seble Nigussie
 
basic introduction of html tags
basic introduction  of html tagsbasic introduction  of html tags
basic introduction of html tags
Manish jariyal
 
Web Page Designing Using HTML
Web Page Designing Using HTMLWeb Page Designing Using HTML
Web Page Designing Using HTML
Arunima Education Foundation
 
How to create basic webpage
How to create basic webpageHow to create basic webpage
How to create basic webpage
James Erro
 
Web technology practical list
Web technology practical listWeb technology practical list
Web technology practical list
desaipratu10
 
Tutorial 08 - Creating Effective Web Pages
Tutorial 08 - Creating Effective Web PagesTutorial 08 - Creating Effective Web Pages
Tutorial 08 - Creating Effective Web Pages
guest22edf3
 
PPT on Basic HTML Tags
PPT on Basic HTML TagsPPT on Basic HTML Tags
PPT on Basic HTML Tags
VinitaPaliwal1
 
Tm 1st quarter - 1st meeting
Tm   1st quarter - 1st meetingTm   1st quarter - 1st meeting
Tm 1st quarter - 1st meeting
Esmeraldo Jr Guimbarda
 
Elements
ElementsElements
Elements
Carlos Pari
 

What's hot (20)

WEB PAGE DESIGN USING HTML
WEB PAGE DESIGN USING HTMLWEB PAGE DESIGN USING HTML
WEB PAGE DESIGN USING HTML
 
HTML_Day_Two(W3Schools)
HTML_Day_Two(W3Schools)HTML_Day_Two(W3Schools)
HTML_Day_Two(W3Schools)
 
Html_Day_One (W3Schools)
Html_Day_One (W3Schools)Html_Day_One (W3Schools)
Html_Day_One (W3Schools)
 
Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTML
 
Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTML
 
Web Development - Lecture 2
Web Development - Lecture 2Web Development - Lecture 2
Web Development - Lecture 2
 
Html presantation
Html presantationHtml presantation
Html presantation
 
HTML Introduction
HTML IntroductionHTML Introduction
HTML Introduction
 
Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTML
 
Html viva questions
Html viva questionsHtml viva questions
Html viva questions
 
Web designing using html
Web designing using htmlWeb designing using html
Web designing using html
 
Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTML
 
basic introduction of html tags
basic introduction  of html tagsbasic introduction  of html tags
basic introduction of html tags
 
Web Page Designing Using HTML
Web Page Designing Using HTMLWeb Page Designing Using HTML
Web Page Designing Using HTML
 
How to create basic webpage
How to create basic webpageHow to create basic webpage
How to create basic webpage
 
Web technology practical list
Web technology practical listWeb technology practical list
Web technology practical list
 
Tutorial 08 - Creating Effective Web Pages
Tutorial 08 - Creating Effective Web PagesTutorial 08 - Creating Effective Web Pages
Tutorial 08 - Creating Effective Web Pages
 
PPT on Basic HTML Tags
PPT on Basic HTML TagsPPT on Basic HTML Tags
PPT on Basic HTML Tags
 
Tm 1st quarter - 1st meeting
Tm   1st quarter - 1st meetingTm   1st quarter - 1st meeting
Tm 1st quarter - 1st meeting
 
Elements
ElementsElements
Elements
 

Similar to Introduction to HTML

HTML_HEADER PART TAGS .pptx
HTML_HEADER              PART TAGS .pptxHTML_HEADER              PART TAGS .pptx
HTML_HEADER PART TAGS .pptx
HARIPRIYAV25
 
Html presentation
Html presentationHtml presentation
Html presentation
YASHRAJSINGH60
 
Html 5
Html 5Html 5
HTML : INTRODUCTION TO WEB DESIGN Presentation
HTML : INTRODUCTION TO WEB DESIGN PresentationHTML : INTRODUCTION TO WEB DESIGN Presentation
HTML : INTRODUCTION TO WEB DESIGN Presentation
surajsutar467
 
Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTML
Shehzad Yaqoob
 
Ict html
Ict htmlIct html
Ict html
Thando Mdluli
 
Appdev appdev appdev app devAPPDEV 1.2.pptx
Appdev appdev appdev app devAPPDEV 1.2.pptxAppdev appdev appdev app devAPPDEV 1.2.pptx
Appdev appdev appdev app devAPPDEV 1.2.pptx
ArjayBalberan1
 
Web Development 1 (HTML & CSS)
Web Development 1 (HTML & CSS)Web Development 1 (HTML & CSS)
Web Development 1 (HTML & CSS)
ghayour abbas
 
Html & Html5 from scratch
Html & Html5 from scratchHtml & Html5 from scratch
Html & Html5 from scratch
Ahmad Al-ammar
 
Introduction to HTML.pptx
Introduction to HTML.pptxIntroduction to HTML.pptx
Introduction to HTML.pptx
VaibhavSingh887876
 
Tutorial on html
Tutorial on htmlTutorial on html
Tutorial on html
Beauty Mthembu
 
HTML.pptx
HTML.pptxHTML.pptx
HTML.pptx
asdfhgjh1
 
Intro to html
Intro to htmlIntro to html
Intro to html
cherrybear2014
 
Introduction to html
Introduction to htmlIntroduction to html
Introduction to html
Jonathan Arroyo
 
Learn html from www
Learn html from wwwLearn html from www
Learn html from www
alvinblue1212
 
How to make Html
How to make HtmlHow to make Html
How to make Html
Meghal Murkute
 
1. html introduction
1. html introduction1. html introduction
1. html introduction
Muhammad Toqeer
 
Presentation1.pdf
Presentation1.pdfPresentation1.pdf
Presentation1.pdf
shrutiindane
 
HTML Comprehensive Overview
HTML Comprehensive OverviewHTML Comprehensive Overview
HTML Comprehensive Overview
Mohamed Loey
 
web development.pdf
web development.pdfweb development.pdf
web development.pdf
BagHarki
 

Similar to Introduction to HTML (20)

HTML_HEADER PART TAGS .pptx
HTML_HEADER              PART TAGS .pptxHTML_HEADER              PART TAGS .pptx
HTML_HEADER PART TAGS .pptx
 
Html presentation
Html presentationHtml presentation
Html presentation
 
Html 5
Html 5Html 5
Html 5
 
HTML : INTRODUCTION TO WEB DESIGN Presentation
HTML : INTRODUCTION TO WEB DESIGN PresentationHTML : INTRODUCTION TO WEB DESIGN Presentation
HTML : INTRODUCTION TO WEB DESIGN Presentation
 
Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTML
 
Ict html
Ict htmlIct html
Ict html
 
Appdev appdev appdev app devAPPDEV 1.2.pptx
Appdev appdev appdev app devAPPDEV 1.2.pptxAppdev appdev appdev app devAPPDEV 1.2.pptx
Appdev appdev appdev app devAPPDEV 1.2.pptx
 
Web Development 1 (HTML & CSS)
Web Development 1 (HTML & CSS)Web Development 1 (HTML & CSS)
Web Development 1 (HTML & CSS)
 
Html & Html5 from scratch
Html & Html5 from scratchHtml & Html5 from scratch
Html & Html5 from scratch
 
Introduction to HTML.pptx
Introduction to HTML.pptxIntroduction to HTML.pptx
Introduction to HTML.pptx
 
Tutorial on html
Tutorial on htmlTutorial on html
Tutorial on html
 
HTML.pptx
HTML.pptxHTML.pptx
HTML.pptx
 
Intro to html
Intro to htmlIntro to html
Intro to html
 
Introduction to html
Introduction to htmlIntroduction to html
Introduction to html
 
Learn html from www
Learn html from wwwLearn html from www
Learn html from www
 
How to make Html
How to make HtmlHow to make Html
How to make Html
 
1. html introduction
1. html introduction1. html introduction
1. html introduction
 
Presentation1.pdf
Presentation1.pdfPresentation1.pdf
Presentation1.pdf
 
HTML Comprehensive Overview
HTML Comprehensive OverviewHTML Comprehensive Overview
HTML Comprehensive Overview
 
web development.pdf
web development.pdfweb development.pdf
web development.pdf
 

Recently uploaded

一比一原版(USYD毕业证)悉尼大学毕业证如何办理
一比一原版(USYD毕业证)悉尼大学毕业证如何办理一比一原版(USYD毕业证)悉尼大学毕业证如何办理
一比一原版(USYD毕业证)悉尼大学毕业证如何办理
k4ncd0z
 
Discover the benefits of outsourcing SEO to India
Discover the benefits of outsourcing SEO to IndiaDiscover the benefits of outsourcing SEO to India
Discover the benefits of outsourcing SEO to India
davidjhones387
 
Bengaluru Dreamin' 24 - Personal Branding
Bengaluru Dreamin' 24 - Personal BrandingBengaluru Dreamin' 24 - Personal Branding
Bengaluru Dreamin' 24 - Personal Branding
Tarandeep Singh
 
办理新西兰奥克兰大学毕业证学位证书范本原版一模一样
办理新西兰奥克兰大学毕业证学位证书范本原版一模一样办理新西兰奥克兰大学毕业证学位证书范本原版一模一样
办理新西兰奥克兰大学毕业证学位证书范本原版一模一样
xjq03c34
 
Honeypots Unveiled: Proactive Defense Tactics for Cyber Security, Phoenix Sum...
Honeypots Unveiled: Proactive Defense Tactics for Cyber Security, Phoenix Sum...Honeypots Unveiled: Proactive Defense Tactics for Cyber Security, Phoenix Sum...
Honeypots Unveiled: Proactive Defense Tactics for Cyber Security, Phoenix Sum...
APNIC
 
怎么办理(umiami毕业证书)美国迈阿密大学毕业证文凭证书实拍图原版一模一样
怎么办理(umiami毕业证书)美国迈阿密大学毕业证文凭证书实拍图原版一模一样怎么办理(umiami毕业证书)美国迈阿密大学毕业证文凭证书实拍图原版一模一样
怎么办理(umiami毕业证书)美国迈阿密大学毕业证文凭证书实拍图原版一模一样
rtunex8r
 
快速办理(新加坡SMU毕业证书)新加坡管理大学毕业证文凭证书一模一样
快速办理(新加坡SMU毕业证书)新加坡管理大学毕业证文凭证书一模一样快速办理(新加坡SMU毕业证书)新加坡管理大学毕业证文凭证书一模一样
快速办理(新加坡SMU毕业证书)新加坡管理大学毕业证文凭证书一模一样
3a0sd7z3
 
Securing BGP: Operational Strategies and Best Practices for Network Defenders...
Securing BGP: Operational Strategies and Best Practices for Network Defenders...Securing BGP: Operational Strategies and Best Practices for Network Defenders...
Securing BGP: Operational Strategies and Best Practices for Network Defenders...
APNIC
 
一比一原版新西兰林肯大学毕业证(Lincoln毕业证书)学历如何办理
一比一原版新西兰林肯大学毕业证(Lincoln毕业证书)学历如何办理一比一原版新西兰林肯大学毕业证(Lincoln毕业证书)学历如何办理
一比一原版新西兰林肯大学毕业证(Lincoln毕业证书)学历如何办理
thezot
 
快速办理(Vic毕业证书)惠灵顿维多利亚大学毕业证完成信一模一样
快速办理(Vic毕业证书)惠灵顿维多利亚大学毕业证完成信一模一样快速办理(Vic毕业证书)惠灵顿维多利亚大学毕业证完成信一模一样
快速办理(Vic毕业证书)惠灵顿维多利亚大学毕业证完成信一模一样
3a0sd7z3
 
Should Repositories Participate in the Fediverse?
Should Repositories Participate in the Fediverse?Should Repositories Participate in the Fediverse?
Should Repositories Participate in the Fediverse?
Paul Walk
 
HijackLoader Evolution: Interactive Process Hollowing
HijackLoader Evolution: Interactive Process HollowingHijackLoader Evolution: Interactive Process Hollowing
HijackLoader Evolution: Interactive Process Hollowing
Donato Onofri
 

Recently uploaded (12)

一比一原版(USYD毕业证)悉尼大学毕业证如何办理
一比一原版(USYD毕业证)悉尼大学毕业证如何办理一比一原版(USYD毕业证)悉尼大学毕业证如何办理
一比一原版(USYD毕业证)悉尼大学毕业证如何办理
 
Discover the benefits of outsourcing SEO to India
Discover the benefits of outsourcing SEO to IndiaDiscover the benefits of outsourcing SEO to India
Discover the benefits of outsourcing SEO to India
 
Bengaluru Dreamin' 24 - Personal Branding
Bengaluru Dreamin' 24 - Personal BrandingBengaluru Dreamin' 24 - Personal Branding
Bengaluru Dreamin' 24 - Personal Branding
 
办理新西兰奥克兰大学毕业证学位证书范本原版一模一样
办理新西兰奥克兰大学毕业证学位证书范本原版一模一样办理新西兰奥克兰大学毕业证学位证书范本原版一模一样
办理新西兰奥克兰大学毕业证学位证书范本原版一模一样
 
Honeypots Unveiled: Proactive Defense Tactics for Cyber Security, Phoenix Sum...
Honeypots Unveiled: Proactive Defense Tactics for Cyber Security, Phoenix Sum...Honeypots Unveiled: Proactive Defense Tactics for Cyber Security, Phoenix Sum...
Honeypots Unveiled: Proactive Defense Tactics for Cyber Security, Phoenix Sum...
 
怎么办理(umiami毕业证书)美国迈阿密大学毕业证文凭证书实拍图原版一模一样
怎么办理(umiami毕业证书)美国迈阿密大学毕业证文凭证书实拍图原版一模一样怎么办理(umiami毕业证书)美国迈阿密大学毕业证文凭证书实拍图原版一模一样
怎么办理(umiami毕业证书)美国迈阿密大学毕业证文凭证书实拍图原版一模一样
 
快速办理(新加坡SMU毕业证书)新加坡管理大学毕业证文凭证书一模一样
快速办理(新加坡SMU毕业证书)新加坡管理大学毕业证文凭证书一模一样快速办理(新加坡SMU毕业证书)新加坡管理大学毕业证文凭证书一模一样
快速办理(新加坡SMU毕业证书)新加坡管理大学毕业证文凭证书一模一样
 
Securing BGP: Operational Strategies and Best Practices for Network Defenders...
Securing BGP: Operational Strategies and Best Practices for Network Defenders...Securing BGP: Operational Strategies and Best Practices for Network Defenders...
Securing BGP: Operational Strategies and Best Practices for Network Defenders...
 
一比一原版新西兰林肯大学毕业证(Lincoln毕业证书)学历如何办理
一比一原版新西兰林肯大学毕业证(Lincoln毕业证书)学历如何办理一比一原版新西兰林肯大学毕业证(Lincoln毕业证书)学历如何办理
一比一原版新西兰林肯大学毕业证(Lincoln毕业证书)学历如何办理
 
快速办理(Vic毕业证书)惠灵顿维多利亚大学毕业证完成信一模一样
快速办理(Vic毕业证书)惠灵顿维多利亚大学毕业证完成信一模一样快速办理(Vic毕业证书)惠灵顿维多利亚大学毕业证完成信一模一样
快速办理(Vic毕业证书)惠灵顿维多利亚大学毕业证完成信一模一样
 
Should Repositories Participate in the Fediverse?
Should Repositories Participate in the Fediverse?Should Repositories Participate in the Fediverse?
Should Repositories Participate in the Fediverse?
 
HijackLoader Evolution: Interactive Process Hollowing
HijackLoader Evolution: Interactive Process HollowingHijackLoader Evolution: Interactive Process Hollowing
HijackLoader Evolution: Interactive Process Hollowing
 

Introduction to HTML

  • 1.
  • 2. What is HTML ? HTML is the standard markup language for creating Web pages. •HTML stands for Hyper Text Markup Language •HTML describes the structure of Web pages using markup •HTML elements are the building blocks of HTML pages NOTE := Browsers do not display the HTML tags, but use them to render the content of the page •HTML elements are represented by tags
  • 3. BASIC STRUCTURE OF HTML • <html> tag denotes that the web page is written in HTML • <head> tag contains information about the web page • <body> tag contains the content of the web page • </html> denotes the end of the web page
  • 4.  All HTML documents must start with a document type declaration: <!DOCTYPE html>.  The HTML document itself begins with <html> and ends with </html>.  The visible part of the HTML document is between <body> and </body>. THINGS TO BE CONSIDERED
  • 6. An HTML element is an individual component of an HTML document or web page, once this has been parsed into the Document Object Model. HTML ELEMENTS 1. BLOCK ELEMENTS 2. INLINE ELEMENTS
  • 7. BLOCK INLINE Block elements are those that take up the full width available on a web page. Inline elements are those who only take up as much width as is needed to display the contents of the element Common block elements: •Paragraphs (<p>) •Headers (<h1> through <h6>) •Lists and list items (<ol>, <ul>, and <li>) •Forms (<form>) Common inline elements •Spans (<span>) •Images (<img>) •Anchors (<a>)
  • 8. HTML Headings • Headings are defined with the <h1> to <h6> tags. • <h1> defines the most important heading. • <h6> defines the least important heading. <h1>Heading 1</h1> <h2>Heading 2</h2> <h3>Heading 3</h3> <h4>Heading 4</h4> <h5>Heading 5</h5> <h6>Heading 6</h6>
  • 9. HTML Paragraphs The HTML <p> element defines a paragraph <p> The quick brown fox jumps over the lazy dog </p> <p> HTML Elements are the building blocks of HTML pages. With HTML constructs, images and other objects such as interactive may be embedded into the rendered page. HTML provides a means to create structured document by denoting structural semantics for text such as headings, paragraphs, lists, links, quotes and other items. HTML elements are delineated by tags, written using angle brackets. Tags such as <img /> and <input /> directly introduce content into the page. Other tags such as <p> surround and provide information about document text and may include other tags as sub-elements. Browsers do not display the HTML tags, but use them to interpret the content of the page. HTML can embed programs written in a scripting language such as JavaScript, which affects the behavior and content of web pages. Inclusion of CSS defines the look and layout of content. The World Wide Web Consortium (W3C), maintainer of both the HTML and the CSS standards, has encouraged the use of CSS over explicit presentational HTML since 1997 </p>
  • 10. • The HTML <br> element defines a line break. HTML Line Breaks • Use <br> if you want a line break (a new line) without starting a new paragraph: <p> This is <br> a paragraph <br> with line breaks.</p>
  • 11. • The <hr> tag defines a thematic break in an HTML page (e.g. a shift of topic). • The <hr> element is used to separate content (or define a change) in an HTML page. HTML Horizontal Breaks <h1>HTML</h1> <p>HTML is a language for describing web pages.....</p> <hr> <h1>CSS</h1> <p>CSS defines how to display HTML elements.....</p>