SlideShare une entreprise Scribd logo
1  sur  9
www.afghanhost.af - info@afghanhost.af
Instructor: Mohammad Rafi Haidari22-May-2014
HTML (Day 1)
 What is HTML
 Attributes and
Elements
 Headings
 Paragraphs
 Formatting
What is HTML?
 HTML is a language for describing web pages.
 HTML stands for Hyper Text Markup Language
 HTML is a markup language
 A markup language is a set of markup tags
 The tags describe document content
 HTML documents contain HTML tags and plain text
 HTML documents are also called web pages
HTML Tags
 HTML markup tags are usually called HTML tags
 HTML tags are keywords (tag names) surrounded
by angle brackets like <html>
 HTML tags normally come in pairs like <b> and
</b>
 The first tag in a pair is the start tag, the second tag
is the end tag
 The end tag is written like the start tag, with
a forward slash before the tag name
 Start and end tags are also called opening
tags and closing tags
HTML Elements & Attributes
"HTML tags" and "HTML
elements" are often used to
describe the same thing.
But strictly speaking, an HTML
element is everything between
the start tag and the end tag,
including the tags:
HTML Element:
<p>This is a paragraph.</p>
 HTML Attributes
 HTML elements can
have attributes
 Attributes provide additional
information about an element
 Attributes are always specified
in the start tag
 Attributes come in name/value
pairs like: name="value"
HTML Elements HTML Attributes
Browsers
The purpose of a web browser (such as Google
Chrome, Internet Explorer, Firefox, Safari) is to read
HTML documents and display them as web pages.
The browser does not display the HTML tags, but
uses the tags to determine how the content of the
HTML page is to be presented/displayed to the user
Web Browsers
HTML Headings
Headings are defined with the <h1> to <h6> tags.
<h1> defines the most important heading. <h6> defines the
least important heading.
<h1> This is a heading </h1>
<h2> This is a heading </h2>
<h3> This is a heading </h3>
Headings
HTML Paragraphs
Paragraphs are defined with the <p> tag.
<p> This is a paragraph </p>
<p> This is another paragraph </p>
Don't Forget the End Tag
Most browsers will display HTML correctly even if you forget the end
tag:
<p> This is a paragraph
<p> This is another paragraph
HTML Line Breaks
Use the <br> tag if you want a line break (a new line) without starting
a new paragraph: <p> This is <br> a para<br>graph with line
HTML Headings
HTML Text Formatting
HTML uses tags like <b> and <i> for formatting output,
like bold or italic text.
These HTML tags are called formatting tags
<b> = This text is bold
<i> = This text is italic
<sub> = This is subscript
<sup> = This is superscript
Formatting
Html_Day_One (W3Schools)

Contenu connexe

Tendances

Html project
Html projectHtml project
Html project
arsh7511
 
HTML Advanced
HTML AdvancedHTML Advanced
HTML Advanced
c525600
 
HTML Intermediate
HTML IntermediateHTML Intermediate
HTML Intermediate
c525600
 
Html (hyper text markup language)
Html (hyper text markup language)Html (hyper text markup language)
Html (hyper text markup language)
Denni Domingo
 
Html notes with Examples
Html notes with ExamplesHtml notes with Examples
Html notes with Examples
isha
 
HTML & Textile Training
HTML & Textile TrainingHTML & Textile Training
HTML & Textile Training
ehealth
 

Tendances (20)

Learning html. (Part- 1)
Learning html. (Part- 1)Learning html. (Part- 1)
Learning html. (Part- 1)
 
Html project
Html projectHtml project
Html project
 
Creating your 1st html page
Creating your 1st html pageCreating your 1st html page
Creating your 1st html page
 
Design Dream
Design DreamDesign Dream
Design Dream
 
HTML Advanced
HTML AdvancedHTML Advanced
HTML Advanced
 
HTML Intermediate
HTML IntermediateHTML Intermediate
HTML Intermediate
 
Understanding THML
Understanding THMLUnderstanding THML
Understanding THML
 
Html (hyper text markup language)
Html (hyper text markup language)Html (hyper text markup language)
Html (hyper text markup language)
 
Html ppt computer
Html ppt computerHtml ppt computer
Html ppt computer
 
Intro to HTML
Intro to HTMLIntro to HTML
Intro to HTML
 
html tags
html tagshtml tags
html tags
 
Headings
HeadingsHeadings
Headings
 
Intro Html
Intro HtmlIntro Html
Intro Html
 
Web development Training in Ambala ! Batra Computer Centre
Web development Training in Ambala ! Batra Computer CentreWeb development Training in Ambala ! Batra Computer Centre
Web development Training in Ambala ! Batra Computer Centre
 
Html tutorial
Html tutorialHtml tutorial
Html tutorial
 
S3 HTML Introduction
S3 HTML IntroductionS3 HTML Introduction
S3 HTML Introduction
 
Notes4
Notes4Notes4
Notes4
 
Html notes with Examples
Html notes with ExamplesHtml notes with Examples
Html notes with Examples
 
HTML & Textile Training
HTML & Textile TrainingHTML & Textile Training
HTML & Textile Training
 
Html tutorial
Html tutorialHtml tutorial
Html tutorial
 

En vedette

7วิชาสามัญ ภาษาไทย
7วิชาสามัญ ภาษาไทย7วิชาสามัญ ภาษาไทย
7วิชาสามัญ ภาษาไทย
sarwsw
 
7วิชาสามัญ เคมี
7วิชาสามัญ เคมี7วิชาสามัญ เคมี
7วิชาสามัญ เคมี
sarwsw
 
Historia juegos olimpicos59
Historia juegos olimpicos59Historia juegos olimpicos59
Historia juegos olimpicos59
anagarridoaroz99
 

En vedette (14)

Pets of the olympic games
Pets of the olympic gamesPets of the olympic games
Pets of the olympic games
 
Globel warming
Globel warmingGlobel warming
Globel warming
 
Ieee 2014 projects
Ieee 2014 projectsIeee 2014 projects
Ieee 2014 projects
 
Organic products For Men's and women's
Organic products For Men's and women'sOrganic products For Men's and women's
Organic products For Men's and women's
 
7วิชาสามัญ ภาษาไทย
7วิชาสามัญ ภาษาไทย7วิชาสามัญ ภาษาไทย
7วิชาสามัญ ภาษาไทย
 
Dotnet ieee 2014 projects
Dotnet ieee 2014 projectsDotnet ieee 2014 projects
Dotnet ieee 2014 projects
 
Tips for life
Tips for lifeTips for life
Tips for life
 
7วิชาสามัญ เคมี
7วิชาสามัญ เคมี7วิชาสามัญ เคมี
7วิชาสามัญ เคมี
 
Зарубіжні твори ювіляри 2015 року
Зарубіжні твори ювіляри 2015 рокуЗарубіжні твори ювіляри 2015 року
Зарубіжні твори ювіляри 2015 року
 
Historia juegos olimpicos59
Historia juegos olimpicos59Historia juegos olimpicos59
Historia juegos olimpicos59
 
PowePoint
PowePointPowePoint
PowePoint
 
Ssrn id2587282
Ssrn id2587282Ssrn id2587282
Ssrn id2587282
 
"Українське козацтво в датах" (історичний калейдоскоп)
"Українське козацтво в датах" (історичний калейдоскоп)"Українське козацтво в датах" (історичний калейдоскоп)
"Українське козацтво в датах" (історичний калейдоскоп)
 
Historia juegos olimpicos
Historia juegos olimpicosHistoria juegos olimpicos
Historia juegos olimpicos
 

Similaire à Html_Day_One (W3Schools)

htmlnotes-180924151434.pdf dafdkzndsvkdvdd
htmlnotes-180924151434.pdf dafdkzndsvkdvddhtmlnotes-180924151434.pdf dafdkzndsvkdvdd
htmlnotes-180924151434.pdf dafdkzndsvkdvdd
hemanthkalyan25
 
htmlnotes Which tells about all the basic
htmlnotes Which tells about all the basichtmlnotes Which tells about all the basic
htmlnotes Which tells about all the basic
hemanthkalyan25
 

Similaire à Html_Day_One (W3Schools) (20)

Html presentation
Html presentationHtml presentation
Html presentation
 
Html
HtmlHtml
Html
 
Html basics
Html basicsHtml basics
Html basics
 
Html notes
Html notesHtml notes
Html notes
 
HTML-Hyper Text Markup Language
HTML-Hyper Text Markup LanguageHTML-Hyper Text Markup Language
HTML-Hyper Text Markup Language
 
HTML Presentation
HTML Presentation HTML Presentation
HTML Presentation
 
htmlnotes-180924151434.pdf dafdkzndsvkdvdd
htmlnotes-180924151434.pdf dafdkzndsvkdvddhtmlnotes-180924151434.pdf dafdkzndsvkdvdd
htmlnotes-180924151434.pdf dafdkzndsvkdvdd
 
htmlnotes Which tells about all the basic
htmlnotes Which tells about all the basichtmlnotes Which tells about all the basic
htmlnotes Which tells about all the basic
 
Learn html from www
Learn html from wwwLearn html from www
Learn html from www
 
Html presantation
Html presantationHtml presantation
Html presantation
 
Html Workshop
Html WorkshopHtml Workshop
Html Workshop
 
Html basics NOTE
Html basics NOTEHtml basics NOTE
Html basics NOTE
 
Introduction to HTML.pptx
Introduction to HTML.pptxIntroduction to HTML.pptx
Introduction to HTML.pptx
 
Html - Tutorial
Html - TutorialHtml - Tutorial
Html - Tutorial
 
html.pptx
html.pptxhtml.pptx
html.pptx
 
Html introduction
Html introductionHtml introduction
Html introduction
 
Html example
Html exampleHtml example
Html example
 
Basic Html Notes
Basic Html NotesBasic Html Notes
Basic Html Notes
 
Html tutorial
Html tutorialHtml tutorial
Html tutorial
 
Html tutorial
Html tutorialHtml tutorial
Html tutorial
 

Plus de Rafi Haidari

Plus de Rafi Haidari (16)

Lecture9 web design and development
Lecture9 web design and developmentLecture9 web design and development
Lecture9 web design and development
 
Lecture8 web design and development
Lecture8 web design and developmentLecture8 web design and development
Lecture8 web design and development
 
Lecture7 web design and development
Lecture7 web design and developmentLecture7 web design and development
Lecture7 web design and development
 
Lecture6 web design and development
Lecture6 web design and developmentLecture6 web design and development
Lecture6 web design and development
 
Lecture5 web design and development
Lecture5 web design and developmentLecture5 web design and development
Lecture5 web design and development
 
Lecture4 web design and development
Lecture4 web design and developmentLecture4 web design and development
Lecture4 web design and development
 
Lecture3 web design and development
Lecture3 web design and developmentLecture3 web design and development
Lecture3 web design and development
 
Lecture2 web design and development
Lecture2 web design and developmentLecture2 web design and development
Lecture2 web design and development
 
Lecture1 Web Design and Development
Lecture1 Web Design and DevelopmentLecture1 Web Design and Development
Lecture1 Web Design and Development
 
Bootstrap day3
Bootstrap day3Bootstrap day3
Bootstrap day3
 
Bootstrap day2
Bootstrap day2Bootstrap day2
Bootstrap day2
 
Bootstrap day1
Bootstrap day1Bootstrap day1
Bootstrap day1
 
CSS_Day_ONE (W3schools)
CSS_Day_ONE (W3schools)CSS_Day_ONE (W3schools)
CSS_Day_ONE (W3schools)
 
CSS_Day_Two (W3schools)
CSS_Day_Two (W3schools)CSS_Day_Two (W3schools)
CSS_Day_Two (W3schools)
 
CSS_Day_Three (W3schools)
CSS_Day_Three (W3schools)CSS_Day_Three (W3schools)
CSS_Day_Three (W3schools)
 
Html_Day_Three(W3Schools)
Html_Day_Three(W3Schools)Html_Day_Three(W3Schools)
Html_Day_Three(W3Schools)
 

Dernier

IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI Solutions
Enterprise Knowledge
 
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptxEIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
Earley Information Science
 

Dernier (20)

TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
 
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityBoost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivity
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI Solutions
 
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonData Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
 
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)
 
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)
 
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
 
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024
 
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
 
How to convert PDF to text with Nanonets
How to convert PDF to text with NanonetsHow to convert PDF to text with Nanonets
How to convert PDF to text with Nanonets
 
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
 
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfThe Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptxEIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
 

Html_Day_One (W3Schools)

  • 1. www.afghanhost.af - info@afghanhost.af Instructor: Mohammad Rafi Haidari22-May-2014 HTML (Day 1)  What is HTML  Attributes and Elements  Headings  Paragraphs  Formatting
  • 2. What is HTML?  HTML is a language for describing web pages.  HTML stands for Hyper Text Markup Language  HTML is a markup language  A markup language is a set of markup tags  The tags describe document content  HTML documents contain HTML tags and plain text  HTML documents are also called web pages
  • 3. HTML Tags  HTML markup tags are usually called HTML tags  HTML tags are keywords (tag names) surrounded by angle brackets like <html>  HTML tags normally come in pairs like <b> and </b>  The first tag in a pair is the start tag, the second tag is the end tag  The end tag is written like the start tag, with a forward slash before the tag name  Start and end tags are also called opening tags and closing tags
  • 4. HTML Elements & Attributes "HTML tags" and "HTML elements" are often used to describe the same thing. But strictly speaking, an HTML element is everything between the start tag and the end tag, including the tags: HTML Element: <p>This is a paragraph.</p>  HTML Attributes  HTML elements can have attributes  Attributes provide additional information about an element  Attributes are always specified in the start tag  Attributes come in name/value pairs like: name="value" HTML Elements HTML Attributes
  • 5. Browsers The purpose of a web browser (such as Google Chrome, Internet Explorer, Firefox, Safari) is to read HTML documents and display them as web pages. The browser does not display the HTML tags, but uses the tags to determine how the content of the HTML page is to be presented/displayed to the user Web Browsers
  • 6. HTML Headings Headings are defined with the <h1> to <h6> tags. <h1> defines the most important heading. <h6> defines the least important heading. <h1> This is a heading </h1> <h2> This is a heading </h2> <h3> This is a heading </h3> Headings
  • 7. HTML Paragraphs Paragraphs are defined with the <p> tag. <p> This is a paragraph </p> <p> This is another paragraph </p> Don't Forget the End Tag Most browsers will display HTML correctly even if you forget the end tag: <p> This is a paragraph <p> This is another paragraph HTML Line Breaks Use the <br> tag if you want a line break (a new line) without starting a new paragraph: <p> This is <br> a para<br>graph with line HTML Headings
  • 8. HTML Text Formatting HTML uses tags like <b> and <i> for formatting output, like bold or italic text. These HTML tags are called formatting tags <b> = This text is bold <i> = This text is italic <sub> = This is subscript <sup> = This is superscript Formatting