SlideShare uma empresa Scribd logo
1 de 32
HTML TAGS BY NIRMAL FELIX.K
INTRODUCTION: ,[object Object],[object Object],[object Object],[object Object],[object Object]
Basic HTML Tag  Tag  Description <html>  Defines an HTML document <head>  Defines information about the  document <title>  Defines the document title <body>  Defines the document's body <h1> to <h6>  Defines header 1 to header 6 <p>  Defines a paragraph <br>  Inserts a single line break <hr>  Defines a horizontal rule
<html>tag This element tells a browser that this is an HTML document. This tag is defined at the top of the HTML file and at the end of file.   Format: <html> <body>..............body of HTML.............</body></html>   Example: <html> <body> this is my first page </body></html>
<head> tag The head tag defines information about the document. The browser does not display the &quot;head information&quot; to the user. The following tags can be in the head section: <base>, <link>, <meta>, <script>, <style>, and <title>. The head tag is used between <html> and <body> tags.   Format: <html> <head>.....head sections....</head><body>......body of HTML........</body></html>   Example: <html> <head><title>Basic tag</title></head>>body> this is my first page </body></html>
<title> tag Title tag defines the title of the document which appears in the Title bar of the explorer window. Title tag is used in between <head> and </head> tag because it is title tag is section of <head> tag.   Format: <html> <head><title>Title of the Page</title></head><body>.....body of HTML......</body></html>   Example: <html> <head><title>Basic tag</title></head><body> this is my first page </body></html>
<body> tag The body element defines the document's body. It contains all the contents of the document (like text, images, colors, graphics etc).   Format: <body bgcolor =&quot;color_name&quot; background=&quot;file_name&quot; links=&quot;color_name&quot; text=&quot;color_name&quot;>    Example: <body bgcolor =&quot;red&quot; background=&quot;c:mgky.jpg&quot; links=&quot;blue&quot; text=&quot;black&quot;>  
<hn>...</hn> Heading Tags These tags are used to display headings in an HTML document. through these tags you can increase the size of the text. In these tags <h1> tag defines the largest header & <h6> defines smallest.   These tags are <h1> </h1>, <h2> </h2>, <h3> </h3>, <h4> </h4>, <h5> </h5> Format: <hn>.............. text..............</hn> Example: <h1> this is my first page </h1> or <h1 align=&quot;right&quot;>text</h1> Attribute of the <hn> Tag.
<p>.....</p> Paragraph Tag This tag is used for creating the paragraph in the web page. It is used inside the body of file.   Format: <p>......longtext..........</p>   Example: <p> This is the test of paragraph tag........</p>   In this tag align attribute can be used.
<br> tag The <br> tag inserts a single line break. Use the <br> tag to enter blank lines, not to separate paragraphs. This tag has no end tag.   Format text........<br> .....text   Example: This is a break <br> in the line.
<hr> tag The <hr> tag inserts a horizontal rule. The <hr> tag has no end tag.   Format: text......<hr> ......text or text......<hr align=&quot; &quot; size=&quot; &quot; width=&quot; &quot;>.... text   Example: This is the test of the tag <hr>  
<!--...--> Comment Tag The comment tag is used to insert a comment in the source code. A comment will be ignored by the browser. You can use comments to explain your code, which can help you when you edit the source code at a later date.   You can also store program-specific information inside comments. In this case they will not be visible for the user, but they are still available to the program. A good practice is to comment the text inside the script and style elements to prevent older browsers, that do not support scripting or styles, from showing it as plain text.   Format: <!-- add here your comments these will not be displayed -->   Example: <!-- add here your comments these will not be displayed -->
 
Example for basic command: <html> <head> <title>In body tag</title> </head> <body bgcolor=&quot;lightyellow&quot; text=&quot;red&quot;> In body tag, background color is defined as black and textcolor is defined as the white. <hr> <h1> this is the h1 header </h1> <h2> this is the h2header </h2> <h3> this is the h3 header </h3> <h4> this is the h4 header </h4> <h5> this is the h5 header </h5> <hr>This is the use of &quot;Break&quot; tag<br> and you will see use of more tags<br> <hr> look at the use of comment tag it is<!-- It is a comment line --> good <hr><p> This is the use of paragraph tag and you will see use of more tags </p> The effect of &quot;hr&quot; tag <br> <hr> </body> </html>
<hr>This is the use of &quot;Break&quot; tag<br> and you will see use of more tags<br> <hr> look at the use of comment tag it is<!-- It is a comment line --> good <hr><p> This is the use of paragraph tag and you will see use of more tags </p> The effect of &quot;hr&quot; tag <br> <hr> </body> </html>
[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
<small> Displays small text   <strong> Displays strong text   <sub> Displays subscripted text <sup>   Displays superscripted text <bdo> Defines the direction of text display <font> Defines the font face, size, and color of  text
<b> Tag The <b> tag is used to make the text bold.   Format: <b> ................text.........</b>   <i> Tag The <i> tag displays the italic text.   Format: <i> ................text.........</i>;     <tt> Tag The <tt> tag displays the typewriter text.   Format: <tt> ................text.........</tt>  
<u> Tag The <u> tag displays the underlined text.   Format: <u> ................text.........</u>   <em> Tag The <em> tag displays the emphasized text.   Format: <em> ................text.........</em>     <big> Tag The <big> tag displays the big text.   Format: <big> ................text.........</big>  
<small> Tag The <small> tag displays the small text.   Format: <small> ................text.........</small>   <strong> Tag The <strong> tag displays strong text.   Format: <strong> ................text.........</strong>   <sub> Tag The <sub> tag displays text in subscripted format.   Format: <sub> ................text.........</sub>
<sup> Tag The <sup> tag displays superscripted text.   Format: <sup> ................text.........</sup>     <bdo> Tag The <bdo> tag defines the direction of the text.    Format: <bdo> ................text.........</bdo>     <font> Tag The <font> tag defines the font, color, size of the text.   Format: <font face=&quot;font_name&quot; color=&quot;color_name&quot; size=&quot;number&quot;>........text.........</font>   
Example: for character tag: <html>< body>  <b>This text is bold</b> <br>  <strong> This text is strong </strong> <br>  <big> This text is big </big> <br>  <em> This text is emphasized </em> <br>  <i> This text is italic </i> <br>  <small> This text is small </small> <br>  <u> this is underlined text </u> <br>  This text contains  <sub> subscript </sub>
<br>  This text contains  <sup> superscript </sup>  <br> The use of font tag  <font face=&quot;arial&quot; size=&quot;3&quot; color=&quot;green&quot;>  this is use of font tag</font> </body> html>
 
Output Tags   These tags are often used to display computer/programming code. You might be surprised for &quot;how to display the text containing the spaces, line breaks, programming codes, sample text, define variable&quot;. Do not worry, because in this chapter we are going to show you how easily you can do easily.    So lets start with these tags:    Tag Description <pre> Defines preformatted text <code> Defines computer code text <tt> Defines teletype text <kbd> Defines keyboard text <var> Defines a variable <dfn> Defines a definition term <bdo> Defines the direction of text display <samp> Defines sample computer code  
<pre>.........</pre>Tag This is preformatted text. It preserves both spaces and line breaks. The pre tag is good for displaying computer code. Format: <pre> .....text.....</pre> Example: <pre> for i = 1 to 10 print i next i </pre> Output: for i = 1 to 10 print i next i
<code> .....text ......</code> Tag  This tag is also used to display the computer code. But better you use <pre> tag. Format: <code> .....text.....</code>  <kbd>.....Keyboard Input......</kbd> Tag  This tag displays the Keyboard Input. Format: <kbd> ........ Keyboard Input......</kbd>  <tt>......text....</tt> Tag  This tag displays the typewriter text. Format: <tt> .....text.....</tt>
<samp>....sample text...</samp> Tag  This tag displays the sample text.   Format: <samp> .....sample text.....</samp>  <var> computer variable </var>  This tag defines the computer variable.   Format: <var> computer variable </var>   <dfn> definition term </dfn>  this tag is used for definition term.
EXAMPLE <html>  <body> <code>Computer code</code>  <br>  <kbd>Keyboard input</kbd>  <br>  <tt>Teletype text</tt>  <br>  <samp>Sample text</samp>  <br>
<var>Computer variable</var>  <br>  <p>  <b>Note:</b>  These tags are often used to display computer/programming code.  </p>  </body>  </html>
 
THANK YOU

Mais conteúdo relacionado

Mais procurados

Mais procurados (19)

Html1
Html1Html1
Html1
 
Html
HtmlHtml
Html
 
Eye catching HTML BASICS tips: Learn easily
Eye catching HTML BASICS tips: Learn easilyEye catching HTML BASICS tips: Learn easily
Eye catching HTML BASICS tips: Learn easily
 
Html ppt
Html pptHtml ppt
Html ppt
 
Html text formatting
Html text formattingHtml text formatting
Html text formatting
 
Understanding THML
Understanding THMLUnderstanding THML
Understanding THML
 
Learning HTML
Learning HTMLLearning HTML
Learning HTML
 
Intro Html
Intro HtmlIntro Html
Intro Html
 
The Basics of (X)HTML Tags
The Basics of (X)HTML TagsThe Basics of (X)HTML Tags
The Basics of (X)HTML Tags
 
Html introduction
Html introductionHtml introduction
Html introduction
 
Html
HtmlHtml
Html
 
Introduction to html
Introduction to htmlIntroduction to html
Introduction to html
 
Introduction to html
Introduction to htmlIntroduction to html
Introduction to html
 
HTML (Web) basics for a beginner
HTML (Web) basics for a beginnerHTML (Web) basics for a beginner
HTML (Web) basics for a beginner
 
Html Presentation Of Web Page Making
Html Presentation Of Web Page MakingHtml Presentation Of Web Page Making
Html Presentation Of Web Page Making
 
Lecture 2 introduction to html
Lecture 2  introduction to htmlLecture 2  introduction to html
Lecture 2 introduction to html
 
LAMP_TRAINING_SESSION_3
LAMP_TRAINING_SESSION_3LAMP_TRAINING_SESSION_3
LAMP_TRAINING_SESSION_3
 
Html ppt computer
Html ppt computerHtml ppt computer
Html ppt computer
 
static dynamic html tags
static dynamic html tagsstatic dynamic html tags
static dynamic html tags
 

Destaque

Destaque (20)

Lab#2 overview of html
Lab#2 overview of htmlLab#2 overview of html
Lab#2 overview of html
 
Java 8 Collection API Updates
Java 8 Collection API UpdatesJava 8 Collection API Updates
Java 8 Collection API Updates
 
Html tags slides 2016
Html tags slides 2016Html tags slides 2016
Html tags slides 2016
 
Pertemuan 3-html
Pertemuan 3-htmlPertemuan 3-html
Pertemuan 3-html
 
TUGAS 2 KELOMPOK_0916
TUGAS 2 KELOMPOK_0916TUGAS 2 KELOMPOK_0916
TUGAS 2 KELOMPOK_0916
 
Mikko
MikkoMikko
Mikko
 
Visual programming
Visual programmingVisual programming
Visual programming
 
TUGAS 2 KELOMPOK_0916
TUGAS 2 KELOMPOK_0916TUGAS 2 KELOMPOK_0916
TUGAS 2 KELOMPOK_0916
 
Java collection
Java collectionJava collection
Java collection
 
Html tag html 10 x10 wen liu art 2830
Html tag html 10 x10 wen liu art 2830Html tag html 10 x10 wen liu art 2830
Html tag html 10 x10 wen liu art 2830
 
HTML Tags
HTML TagsHTML Tags
HTML Tags
 
Tag html
Tag htmlTag html
Tag html
 
Human Ear
Human EarHuman Ear
Human Ear
 
Collection Framework in java
Collection Framework in javaCollection Framework in java
Collection Framework in java
 
Keandalan Memori
Keandalan MemoriKeandalan Memori
Keandalan Memori
 
Material Konduktor
Material KonduktorMaterial Konduktor
Material Konduktor
 
Pemrograman Python untuk Pemula
Pemrograman Python untuk PemulaPemrograman Python untuk Pemula
Pemrograman Python untuk Pemula
 
Code HTML Lengkap
Code HTML LengkapCode HTML Lengkap
Code HTML Lengkap
 
Java Collection framework
Java Collection frameworkJava Collection framework
Java Collection framework
 
Java Collections
Java CollectionsJava Collections
Java Collections
 

Semelhante a Html tag (20)

Htmltag.ppt
Htmltag.pptHtmltag.ppt
Htmltag.ppt
 
Introduction to html
Introduction to htmlIntroduction to html
Introduction to html
 
Prabu html
Prabu htmlPrabu html
Prabu html
 
Html
HtmlHtml
Html
 
Html
HtmlHtml
Html
 
Html intro
Html introHtml intro
Html intro
 
Html intro
Html introHtml intro
Html intro
 
Cascading Style Sheets
Cascading Style SheetsCascading Style Sheets
Cascading Style Sheets
 
Diva
DivaDiva
Diva
 
Html
HtmlHtml
Html
 
Html
HtmlHtml
Html
 
Tags in html
Tags in htmlTags in html
Tags in html
 
Html part2
Html part2Html part2
Html part2
 
Html part2 (1)
Html part2 (1)Html part2 (1)
Html part2 (1)
 
AK html
AK  htmlAK  html
AK html
 
Html
HtmlHtml
Html
 
Html tutorial
Html tutorialHtml tutorial
Html tutorial
 
Module 2
Module 2Module 2
Module 2
 
HTML Fundamentals
HTML FundamentalsHTML Fundamentals
HTML Fundamentals
 
Html Ppt
Html PptHtml Ppt
Html Ppt
 

Mais de NIRMAL FELIX (8)

Mobile phones
Mobile phonesMobile phones
Mobile phones
 
php basics
php basicsphp basics
php basics
 
Ajax
AjaxAjax
Ajax
 
Css
CssCss
Css
 
My resume
My resumeMy resume
My resume
 
My sql with querys
My sql with querysMy sql with querys
My sql with querys
 
Apache
ApacheApache
Apache
 
Linux50commands
Linux50commandsLinux50commands
Linux50commands
 

Último

Tech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdfTech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdfhans926745
 
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 DevelopmentsTrustArc
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century educationjfdjdjcjdnsjd
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?Igalia
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...Martijn de Jong
 
GenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdfGenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdflior mazor
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024The Digital Insurer
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Scriptwesley chun
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptxHampshireHUG
 
Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024The Digital Insurer
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processorsdebabhi2
 
Advantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your BusinessAdvantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your BusinessPixlogix Infotech
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024Rafal Los
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CVKhem
 
HTML Injection Attacks: Impact and Mitigation Strategies
HTML Injection Attacks: Impact and Mitigation StrategiesHTML Injection Attacks: Impact and Mitigation Strategies
HTML Injection Attacks: Impact and Mitigation StrategiesBoston Institute of Analytics
 
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024The Digital Insurer
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...apidays
 
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 WorkerThousandEyes
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProduct Anonymous
 

Último (20)

Tech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdfTech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdf
 
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
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
 
GenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdfGenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdf
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
 
Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
 
Advantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your BusinessAdvantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your Business
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
 
HTML Injection Attacks: Impact and Mitigation Strategies
HTML Injection Attacks: Impact and Mitigation StrategiesHTML Injection Attacks: Impact and Mitigation Strategies
HTML Injection Attacks: Impact and Mitigation Strategies
 
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
 
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
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 

Html tag

  • 1. HTML TAGS BY NIRMAL FELIX.K
  • 2.
  • 3. Basic HTML Tag Tag Description <html> Defines an HTML document <head> Defines information about the document <title> Defines the document title <body> Defines the document's body <h1> to <h6> Defines header 1 to header 6 <p> Defines a paragraph <br> Inserts a single line break <hr> Defines a horizontal rule
  • 4. <html>tag This element tells a browser that this is an HTML document. This tag is defined at the top of the HTML file and at the end of file.   Format: <html> <body>..............body of HTML.............</body></html>   Example: <html> <body> this is my first page </body></html>
  • 5. <head> tag The head tag defines information about the document. The browser does not display the &quot;head information&quot; to the user. The following tags can be in the head section: <base>, <link>, <meta>, <script>, <style>, and <title>. The head tag is used between <html> and <body> tags.   Format: <html> <head>.....head sections....</head><body>......body of HTML........</body></html>   Example: <html> <head><title>Basic tag</title></head>>body> this is my first page </body></html>
  • 6. <title> tag Title tag defines the title of the document which appears in the Title bar of the explorer window. Title tag is used in between <head> and </head> tag because it is title tag is section of <head> tag.   Format: <html> <head><title>Title of the Page</title></head><body>.....body of HTML......</body></html>   Example: <html> <head><title>Basic tag</title></head><body> this is my first page </body></html>
  • 7. <body> tag The body element defines the document's body. It contains all the contents of the document (like text, images, colors, graphics etc).   Format: <body bgcolor =&quot;color_name&quot; background=&quot;file_name&quot; links=&quot;color_name&quot; text=&quot;color_name&quot;>   Example: <body bgcolor =&quot;red&quot; background=&quot;c:mgky.jpg&quot; links=&quot;blue&quot; text=&quot;black&quot;>  
  • 8. <hn>...</hn> Heading Tags These tags are used to display headings in an HTML document. through these tags you can increase the size of the text. In these tags <h1> tag defines the largest header & <h6> defines smallest.   These tags are <h1> </h1>, <h2> </h2>, <h3> </h3>, <h4> </h4>, <h5> </h5> Format: <hn>.............. text..............</hn> Example: <h1> this is my first page </h1> or <h1 align=&quot;right&quot;>text</h1> Attribute of the <hn> Tag.
  • 9. <p>.....</p> Paragraph Tag This tag is used for creating the paragraph in the web page. It is used inside the body of file.   Format: <p>......longtext..........</p>   Example: <p> This is the test of paragraph tag........</p>   In this tag align attribute can be used.
  • 10. <br> tag The <br> tag inserts a single line break. Use the <br> tag to enter blank lines, not to separate paragraphs. This tag has no end tag.   Format text........<br> .....text   Example: This is a break <br> in the line.
  • 11. <hr> tag The <hr> tag inserts a horizontal rule. The <hr> tag has no end tag.   Format: text......<hr> ......text or text......<hr align=&quot; &quot; size=&quot; &quot; width=&quot; &quot;>.... text   Example: This is the test of the tag <hr>  
  • 12. <!--...--> Comment Tag The comment tag is used to insert a comment in the source code. A comment will be ignored by the browser. You can use comments to explain your code, which can help you when you edit the source code at a later date.   You can also store program-specific information inside comments. In this case they will not be visible for the user, but they are still available to the program. A good practice is to comment the text inside the script and style elements to prevent older browsers, that do not support scripting or styles, from showing it as plain text.   Format: <!-- add here your comments these will not be displayed -->   Example: <!-- add here your comments these will not be displayed -->
  • 13.  
  • 14. Example for basic command: <html> <head> <title>In body tag</title> </head> <body bgcolor=&quot;lightyellow&quot; text=&quot;red&quot;> In body tag, background color is defined as black and textcolor is defined as the white. <hr> <h1> this is the h1 header </h1> <h2> this is the h2header </h2> <h3> this is the h3 header </h3> <h4> this is the h4 header </h4> <h5> this is the h5 header </h5> <hr>This is the use of &quot;Break&quot; tag<br> and you will see use of more tags<br> <hr> look at the use of comment tag it is<!-- It is a comment line --> good <hr><p> This is the use of paragraph tag and you will see use of more tags </p> The effect of &quot;hr&quot; tag <br> <hr> </body> </html>
  • 15. <hr>This is the use of &quot;Break&quot; tag<br> and you will see use of more tags<br> <hr> look at the use of comment tag it is<!-- It is a comment line --> good <hr><p> This is the use of paragraph tag and you will see use of more tags </p> The effect of &quot;hr&quot; tag <br> <hr> </body> </html>
  • 16.
  • 17. <small> Displays small text <strong> Displays strong text <sub> Displays subscripted text <sup> Displays superscripted text <bdo> Defines the direction of text display <font> Defines the font face, size, and color of text
  • 18. <b> Tag The <b> tag is used to make the text bold.   Format: <b> ................text.........</b>   <i> Tag The <i> tag displays the italic text.   Format: <i> ................text.........</i>;     <tt> Tag The <tt> tag displays the typewriter text.   Format: <tt> ................text.........</tt>  
  • 19. <u> Tag The <u> tag displays the underlined text.   Format: <u> ................text.........</u>   <em> Tag The <em> tag displays the emphasized text.   Format: <em> ................text.........</em>     <big> Tag The <big> tag displays the big text.   Format: <big> ................text.........</big>  
  • 20. <small> Tag The <small> tag displays the small text.   Format: <small> ................text.........</small>   <strong> Tag The <strong> tag displays strong text.   Format: <strong> ................text.........</strong>   <sub> Tag The <sub> tag displays text in subscripted format.   Format: <sub> ................text.........</sub>
  • 21. <sup> Tag The <sup> tag displays superscripted text.   Format: <sup> ................text.........</sup>     <bdo> Tag The <bdo> tag defines the direction of the text.   Format: <bdo> ................text.........</bdo>     <font> Tag The <font> tag defines the font, color, size of the text.   Format: <font face=&quot;font_name&quot; color=&quot;color_name&quot; size=&quot;number&quot;>........text.........</font>  
  • 22. Example: for character tag: <html>< body> <b>This text is bold</b> <br> <strong> This text is strong </strong> <br> <big> This text is big </big> <br> <em> This text is emphasized </em> <br> <i> This text is italic </i> <br> <small> This text is small </small> <br> <u> this is underlined text </u> <br> This text contains <sub> subscript </sub>
  • 23. <br> This text contains <sup> superscript </sup> <br> The use of font tag <font face=&quot;arial&quot; size=&quot;3&quot; color=&quot;green&quot;> this is use of font tag</font> </body> html>
  • 24.  
  • 25. Output Tags   These tags are often used to display computer/programming code. You might be surprised for &quot;how to display the text containing the spaces, line breaks, programming codes, sample text, define variable&quot;. Do not worry, because in this chapter we are going to show you how easily you can do easily.   So lets start with these tags:   Tag Description <pre> Defines preformatted text <code> Defines computer code text <tt> Defines teletype text <kbd> Defines keyboard text <var> Defines a variable <dfn> Defines a definition term <bdo> Defines the direction of text display <samp> Defines sample computer code  
  • 26. <pre>.........</pre>Tag This is preformatted text. It preserves both spaces and line breaks. The pre tag is good for displaying computer code. Format: <pre> .....text.....</pre> Example: <pre> for i = 1 to 10 print i next i </pre> Output: for i = 1 to 10 print i next i
  • 27. <code> .....text ......</code> Tag This tag is also used to display the computer code. But better you use <pre> tag. Format: <code> .....text.....</code> <kbd>.....Keyboard Input......</kbd> Tag This tag displays the Keyboard Input. Format: <kbd> ........ Keyboard Input......</kbd> <tt>......text....</tt> Tag This tag displays the typewriter text. Format: <tt> .....text.....</tt>
  • 28. <samp>....sample text...</samp> Tag This tag displays the sample text.   Format: <samp> .....sample text.....</samp> <var> computer variable </var> This tag defines the computer variable.   Format: <var> computer variable </var>   <dfn> definition term </dfn> this tag is used for definition term.
  • 29. EXAMPLE <html> <body> <code>Computer code</code> <br> <kbd>Keyboard input</kbd> <br> <tt>Teletype text</tt> <br> <samp>Sample text</samp> <br>
  • 30. <var>Computer variable</var> <br> <p> <b>Note:</b> These tags are often used to display computer/programming code. </p> </body> </html>
  • 31.