SlideShare ist ein Scribd-Unternehmen logo
1 von 19
Basic HTML Tags
Z TONYELA 215020312
“
What is HTML?
 It is the standard mark-up
language for creating Web
pages.
2
HYPER TEXT
MARKUP LANGUAGE
 An HTML file is text containing small mark
up tags
 The mark up tags tell the Web browser
how to display the page
 An HTML file must have an htm or html file
extension.
3
What are HTML tags?
 HTML tags are the hidden keywords within a web
page that define how your web browser must
format and display the content.:
<tagname> content goes here ……</tagname>
4
5
Basic document tags
 <html>
 <head>
 <title>
 <body>
 <h1>to <h6>
 <p>
 <br>
Defines an HTML document
Opening tag <html>
Closing tag </html>
6
<html>
It defines information about the
document.
Opening tag <head>
Closing tag </head>
7
<head>
It defines a title for the document.
Opening tag <title>
Closing tag </title>
8
<title>
It defines the document’s body.
Opening tag <body>
Closing tag </body>
9
<body>
It defines the HTML headings.
Opening tag <h1> or <h6>
Closing tag </h1> or </h6>
Note: h1 is a first heading and the largest
whereas h6 is a sixth level and the smallest
10
<h1> to <h6>
It defines a paragraph.
Opening tag <p>
Closing tag </p>
11
<p>
It inserts a single line break.
Opening tag <br>
Closing tag The <br> tag is an
empty tag which means that it has
no end tag.
12
<br>
TEST YOUR KNOWLEDGE
1. Use your Notepad ++ to capture the following HTML code.
2. Save as a web page called MyWeb, for example,MyWeb.html.
3.View your webpage with your web browser.
13
14
 <html>
 <head>
 <title>My web page</title>
 </head>
 <body>
 <h1>h1 to h6 is used for headings 1</h1>
 <hr/>The horizontal rule tag creates a
line across the page.It is often used to
separate two sections of a web page.
 <br/>The break tag inserts a blank line.
15
 <p>The paragraph tag will force a new
paragraph on the display on the web
page</p>
 <p>The break tag is an empty tag and
does not need anything to close it.
<br/>Remember that the break tag
inserts a blank line while the paragraph
tag forces text to a new line.</p>
 <p><b>The bold tag is placed between
the paragraph tags if that whole
paragraph is to be bold</b></p>
16
 <p><i>The italics tag is placed between the
paragraph tags if that whole paragraph is to
be italics.</i></p>
 <p><b><i>Paragraph tags are the outermost
tags that then contain the bold and the
italics tags. Note the order of the opening
tags and the closing tags, that is p b i and
then i b p. bold</i></b></p>
 </body>
 </html>
17
THIS IS HOW IT SHOULD LOOK
18
References
 W3 Schools
http://www.w3schools.com/html/default
.asp
 Mindset Learn
http://learn.mindset.co.za/resources/co
mputer-applications-technology/grade-
11/solutions-development-html
THANKS!
Any questions?
You can find me at:
Zintle.t@webmail.co.za
19

Weitere ähnliche Inhalte

Was ist angesagt? (20)

Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTML
 
Html
HtmlHtml
Html
 
Introduction to html
Introduction to htmlIntroduction to html
Introduction to html
 
HTML
HTMLHTML
HTML
 
Html basic
Html basicHtml basic
Html basic
 
1. HTML
1. HTML1. HTML
1. HTML
 
Basic html structure
Basic html structureBasic html structure
Basic html structure
 
HTML Introduction
HTML IntroductionHTML Introduction
HTML Introduction
 
Web designing using html
Web designing using htmlWeb designing using html
Web designing using html
 
HTML Introduction
HTML IntroductionHTML Introduction
HTML Introduction
 
HTML
HTMLHTML
HTML
 
basic introduction of html tags
basic introduction  of html tagsbasic introduction  of html tags
basic introduction of html tags
 
PPT on Basic HTML Tags
PPT on Basic HTML TagsPPT on Basic HTML Tags
PPT on Basic HTML Tags
 
Html Slide Part-1
Html Slide Part-1Html Slide Part-1
Html Slide Part-1
 
[Basic HTML/CSS] 1. html - basic tags
[Basic HTML/CSS] 1. html - basic tags[Basic HTML/CSS] 1. html - basic tags
[Basic HTML/CSS] 1. html - basic tags
 
Html and its tags
Html and its tagsHtml and its tags
Html and its tags
 
Web Page Designing Using HTML
Web Page Designing Using HTMLWeb Page Designing Using HTML
Web Page Designing Using HTML
 
Html Simple Tutorial
Html Simple TutorialHtml Simple Tutorial
Html Simple Tutorial
 
Intro to HTML
Intro to HTMLIntro to HTML
Intro to HTML
 
HTML Text formatting tags
HTML Text formatting tagsHTML Text formatting tags
HTML Text formatting tags
 

Ähnlich wie Html (20)

Html basics
Html basicsHtml basics
Html basics
 
HTML_Basics.pdf
HTML_Basics.pdfHTML_Basics.pdf
HTML_Basics.pdf
 
Html basics
Html basicsHtml basics
Html basics
 
Html basics
Html basicsHtml basics
Html basics
 
Html basics
Html basicsHtml basics
Html basics
 
Html basics
Html basicsHtml basics
Html basics
 
Html basic file
Html basic fileHtml basic file
Html basic file
 
Html basics
Html basicsHtml basics
Html basics
 
Html BASICS
Html BASICSHtml BASICS
Html BASICS
 
Html basics 1
Html basics 1Html basics 1
Html basics 1
 
Html basics NOTE
Html basics NOTEHtml basics NOTE
Html basics NOTE
 
Html basics
Html basicsHtml basics
Html basics
 
html.pdf
html.pdfhtml.pdf
html.pdf
 
Html tutorial
Html tutorialHtml tutorial
Html tutorial
 
HTML and DHTML
HTML and DHTMLHTML and DHTML
HTML and DHTML
 
Basic Html Notes
Basic Html NotesBasic Html Notes
Basic Html Notes
 
Html Workshop
Html WorkshopHtml Workshop
Html Workshop
 
Html1
Html1Html1
Html1
 
Best HTML Training &Coaching in Ambala
Best HTML Training &Coaching in AmbalaBest HTML Training &Coaching in Ambala
Best HTML Training &Coaching in Ambala
 
An introduction to html
An introduction to htmlAn introduction to html
An introduction to html
 

Kürzlich hochgeladen

How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17Celine George
 
Understanding Accommodations and Modifications
Understanding  Accommodations and ModificationsUnderstanding  Accommodations and Modifications
Understanding Accommodations and ModificationsMJDuyan
 
Vishram Singh - Textbook of Anatomy Upper Limb and Thorax.. Volume 1 (1).pdf
Vishram Singh - Textbook of Anatomy  Upper Limb and Thorax.. Volume 1 (1).pdfVishram Singh - Textbook of Anatomy  Upper Limb and Thorax.. Volume 1 (1).pdf
Vishram Singh - Textbook of Anatomy Upper Limb and Thorax.. Volume 1 (1).pdfssuserdda66b
 
Activity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdfActivity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdfciinovamais
 
This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.christianmathematics
 
On National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan FellowsOn National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan FellowsMebane Rash
 
SOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning PresentationSOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning Presentationcamerronhm
 
The basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptxThe basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptxheathfieldcps1
 
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Ữ Â...Nguyen Thanh Tu Collection
 
Accessible Digital Futures project (20/03/2024)
Accessible Digital Futures project (20/03/2024)Accessible Digital Futures project (20/03/2024)
Accessible Digital Futures project (20/03/2024)Jisc
 
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.pptxJisc
 
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).pptxEsquimalt MFRC
 
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptxMaritesTamaniVerdade
 
Basic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptxBasic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptxDenish Jangid
 
1029-Danh muc Sach Giao Khoa khoi 6.pdf
1029-Danh muc Sach Giao Khoa khoi  6.pdf1029-Danh muc Sach Giao Khoa khoi  6.pdf
1029-Danh muc Sach Giao Khoa khoi 6.pdfQucHHunhnh
 
Spellings Wk 3 English CAPS CARES Please Practise
Spellings Wk 3 English CAPS CARES Please PractiseSpellings Wk 3 English CAPS CARES Please Practise
Spellings Wk 3 English CAPS CARES Please PractiseAnaAcapella
 
Introduction to Nonprofit Accounting: The Basics
Introduction to Nonprofit Accounting: The BasicsIntroduction to Nonprofit Accounting: The Basics
Introduction to Nonprofit Accounting: The BasicsTechSoup
 
Sociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning ExhibitSociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning Exhibitjbellavia9
 
Fostering Friendships - Enhancing Social Bonds in the Classroom
Fostering Friendships - Enhancing Social Bonds  in the ClassroomFostering Friendships - Enhancing Social Bonds  in the Classroom
Fostering Friendships - Enhancing Social Bonds in the ClassroomPooky Knightsmith
 
General Principles of Intellectual Property: Concepts of Intellectual Proper...
General Principles of Intellectual Property: Concepts of Intellectual  Proper...General Principles of Intellectual Property: Concepts of Intellectual  Proper...
General Principles of Intellectual Property: Concepts of Intellectual Proper...Poonam Aher Patil
 

Kürzlich hochgeladen (20)

How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17
 
Understanding Accommodations and Modifications
Understanding  Accommodations and ModificationsUnderstanding  Accommodations and Modifications
Understanding Accommodations and Modifications
 
Vishram Singh - Textbook of Anatomy Upper Limb and Thorax.. Volume 1 (1).pdf
Vishram Singh - Textbook of Anatomy  Upper Limb and Thorax.. Volume 1 (1).pdfVishram Singh - Textbook of Anatomy  Upper Limb and Thorax.. Volume 1 (1).pdf
Vishram Singh - Textbook of Anatomy Upper Limb and Thorax.. Volume 1 (1).pdf
 
Activity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdfActivity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdf
 
This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.
 
On National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan FellowsOn National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan Fellows
 
SOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning PresentationSOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning Presentation
 
The basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptxThe basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptx
 
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Ữ Â...
 
Accessible Digital Futures project (20/03/2024)
Accessible Digital Futures project (20/03/2024)Accessible Digital Futures project (20/03/2024)
Accessible Digital Futures project (20/03/2024)
 
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
 
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
 
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
 
Basic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptxBasic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptx
 
1029-Danh muc Sach Giao Khoa khoi 6.pdf
1029-Danh muc Sach Giao Khoa khoi  6.pdf1029-Danh muc Sach Giao Khoa khoi  6.pdf
1029-Danh muc Sach Giao Khoa khoi 6.pdf
 
Spellings Wk 3 English CAPS CARES Please Practise
Spellings Wk 3 English CAPS CARES Please PractiseSpellings Wk 3 English CAPS CARES Please Practise
Spellings Wk 3 English CAPS CARES Please Practise
 
Introduction to Nonprofit Accounting: The Basics
Introduction to Nonprofit Accounting: The BasicsIntroduction to Nonprofit Accounting: The Basics
Introduction to Nonprofit Accounting: The Basics
 
Sociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning ExhibitSociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning Exhibit
 
Fostering Friendships - Enhancing Social Bonds in the Classroom
Fostering Friendships - Enhancing Social Bonds  in the ClassroomFostering Friendships - Enhancing Social Bonds  in the Classroom
Fostering Friendships - Enhancing Social Bonds in the Classroom
 
General Principles of Intellectual Property: Concepts of Intellectual Proper...
General Principles of Intellectual Property: Concepts of Intellectual  Proper...General Principles of Intellectual Property: Concepts of Intellectual  Proper...
General Principles of Intellectual Property: Concepts of Intellectual Proper...
 

Html

  • 1. Basic HTML Tags Z TONYELA 215020312
  • 2. “ What is HTML?  It is the standard mark-up language for creating Web pages. 2 HYPER TEXT MARKUP LANGUAGE
  • 3.  An HTML file is text containing small mark up tags  The mark up tags tell the Web browser how to display the page  An HTML file must have an htm or html file extension. 3
  • 4. What are HTML tags?  HTML tags are the hidden keywords within a web page that define how your web browser must format and display the content.: <tagname> content goes here ……</tagname> 4
  • 5. 5 Basic document tags  <html>  <head>  <title>  <body>  <h1>to <h6>  <p>  <br>
  • 6. Defines an HTML document Opening tag <html> Closing tag </html> 6 <html>
  • 7. It defines information about the document. Opening tag <head> Closing tag </head> 7 <head>
  • 8. It defines a title for the document. Opening tag <title> Closing tag </title> 8 <title>
  • 9. It defines the document’s body. Opening tag <body> Closing tag </body> 9 <body>
  • 10. It defines the HTML headings. Opening tag <h1> or <h6> Closing tag </h1> or </h6> Note: h1 is a first heading and the largest whereas h6 is a sixth level and the smallest 10 <h1> to <h6>
  • 11. It defines a paragraph. Opening tag <p> Closing tag </p> 11 <p>
  • 12. It inserts a single line break. Opening tag <br> Closing tag The <br> tag is an empty tag which means that it has no end tag. 12 <br>
  • 13. TEST YOUR KNOWLEDGE 1. Use your Notepad ++ to capture the following HTML code. 2. Save as a web page called MyWeb, for example,MyWeb.html. 3.View your webpage with your web browser. 13
  • 14. 14  <html>  <head>  <title>My web page</title>  </head>  <body>  <h1>h1 to h6 is used for headings 1</h1>  <hr/>The horizontal rule tag creates a line across the page.It is often used to separate two sections of a web page.  <br/>The break tag inserts a blank line.
  • 15. 15  <p>The paragraph tag will force a new paragraph on the display on the web page</p>  <p>The break tag is an empty tag and does not need anything to close it. <br/>Remember that the break tag inserts a blank line while the paragraph tag forces text to a new line.</p>  <p><b>The bold tag is placed between the paragraph tags if that whole paragraph is to be bold</b></p>
  • 16. 16  <p><i>The italics tag is placed between the paragraph tags if that whole paragraph is to be italics.</i></p>  <p><b><i>Paragraph tags are the outermost tags that then contain the bold and the italics tags. Note the order of the opening tags and the closing tags, that is p b i and then i b p. bold</i></b></p>  </body>  </html>
  • 17. 17 THIS IS HOW IT SHOULD LOOK
  • 18. 18 References  W3 Schools http://www.w3schools.com/html/default .asp  Mindset Learn http://learn.mindset.co.za/resources/co mputer-applications-technology/grade- 11/solutions-development-html
  • 19. THANKS! Any questions? You can find me at: Zintle.t@webmail.co.za 19