SlideShare a Scribd company logo
1 of 10
Revision of HTML
Session-01
Recall Test
1. The BODY tag is usually used after
A. EM Tag
B. HEAD Tag
C. TITLE Tag
D. HTML Tag
2. Choose The Correct HTML Tag To Make A Text Italic
A. <italic>
B. <it>
C. <i>
D. <il>
3. Correct HTML Tag For The Largest Heading is
A. <h6>
B. <heading>
C. <h1>
D. <head>
4. HTML is what type of language?
A. Scripting language
B. Markup language
Introduction to HTML
● Basic document structure of HTML
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>.
● Heading and its types
HTML headings are defined with the <h1> to <h6> tags. <h1> defines the most important heading.
<h6> defines the least important heading.
● How to create paragraph
The HTML <p> element defines a paragraph. A paragraph always starts on a new line, and browsers
automatically add some white space (a margin) before and after a paragraph.
● Learn to style in HTML
The HTML style attribute is used to add styles to an element, such as color, font, size, and more.
HTML Formatting
● <b> - Bold text - defines bold text, without any extra importance.
● <strong> - Important text - defines text with strong importance.
● <i> - Italic text - defines a part of text in an alternate voice or mood.
● <em> - Emphasized text - defines emphasized text.
● <mark> - Marked text - defines text that should be marked or highlighted.
● <small> - Smaller text - defines smaller text.
● <del> - Deleted text - defines text that has been deleted from a document.
● <ins> - Inserted text - defines a text that has been inserted into a document.
Browsers will usually underline inserted text.
● <sub> - Subscript text - defines subscript text. Subscript text appears half a
character below the normal line
● <sup> - Superscript text - defines superscript text. Superscript text appears half a
character above the normal line
HTML Phrase tags
● Marked text - Anything that appears with-in <mark>...</mark> element, is displayed as
marked with yellow ink.
● Text Abbreviation - We can abbreviate a text by putting it inside opening <abbr> and
closing </abbr> tags. If present, the title attribute must contain this full description and
nothing else.
● Acronym element - The <acronym> element allows you to indicate that the text between
<acronym> and </acronym> tags is an acronym.
● Text Direction - The <bdo>...</bdo> element stands for Bi-Directional Override and it is
used to override the current text direction.
● Special terms - The <dfn>...</dfn> element (or HTML Definition Element) allows you to
specify that you are introducing a special term. It's usage is similar to italic words in the
midst of a paragraph.
● Quoting Text - When you want to quote a passage from another source, you should put it
in between <blockquote>...</blockquote> tags.
● Text Citations - If you are quoting a text, you can indicate the source placing it between an
opening <cite> tag and closing </cite> tag
● Address text - The <address>...</address> element is used to contain any address.
HTML Images and tables
A. HTML Images
● The HTML <img> tag is used to embed an image in a web page.
● The <img> tag has two required attributes:
src - Specifies the path to the image.
alt - Specifies an alternate text for the image.
● The required alt attribute provides an alternate text for an image.
● You can use the style attribute to specify the width and height of an image.
For example,
B. HTML Tables:
The <table> tag defines an HTML table. Each table row is defined with a <tr> tag. Each table header
is defined with a <th> tag. Each table data/cell is defined with a <td> tag. By default, the text in <th>
elements are bold and centered. By default, the text in <td> elements are regular and left-aligned.
HTML Forms
An HTML form is used to collect user input which is often sent to a server for processing.
● <form> element : The HTML <form> element is used to create an HTML form for user input. It
is a is a container for different types of input elements. Ex. radio, checkbox, submit, etc.
● <input> element : It is most often used attribute mostly combined with type attribute.
Type Description
<input type="text"> Displays a single-line text input field
<input type="radio"> Displays a radio button (for selecting one of many choices)
<input type="checkbox"> Displays a checkbox (for selecting zero or more of many choices)
<input type="button"> Displays a clickable button
<input type="submit"> Displays a checkbox (for selecting zero or more of many choices)
Concept Test
● Explain the difference between strong and bold in html tag.(refer to HTML formatting)
● The correct sequence of HTML tags for starting a webpage is -
A. Head, Title, HTML, body
B. HTML, Body, Title, Head
C. HTML, Head, Title, Body
● How to create an ordered list (a list with the list items in numbers) in HTML?
A. <ul>
B. <ol>
C. <li>
D. <i>
● How to create a checkbox in HTML?
A. <input type = "checkbox">
B. <input type = "button">
C. <checkbox>
D. <input type = "check">
In Class exercise
Creating a simple HTML story book:
● Use HTML table tag to create a structure of the book.
● Use image and phrase tags to create a storyline.
● Use HTML formatting text and font tags to elaborate your story.
Homework Assignment
Creating a simple HTML Tribute page for your favourite Avenger:
● Create a simple HTML page giving information about your fav. Avenger.
● You can then add a picture of the person you are paying tribute to using
<img> tag.
● Also, add the person’s details, achievements, and so on using HTML
tables.

More Related Content

Similar to Session-1, Revision of HTML.pptx (20)

HTML
HTMLHTML
HTML
 
How to learn HTML in 10 Days
How to learn HTML in 10 DaysHow to learn HTML in 10 Days
How to learn HTML in 10 Days
 
web development.pdf
web development.pdfweb development.pdf
web development.pdf
 
html
htmlhtml
html
 
html tutorial
html tutorialhtml tutorial
html tutorial
 
Html presentation
Html presentationHtml presentation
Html presentation
 
Web Development Basics: HOW TO in HTML
Web Development Basics: HOW TO in HTMLWeb Development Basics: HOW TO in HTML
Web Development Basics: HOW TO in HTML
 
INTERNSHIP PROJECT PPT RAJ HZL.pdf
INTERNSHIP PROJECT PPT RAJ HZL.pdfINTERNSHIP PROJECT PPT RAJ HZL.pdf
INTERNSHIP PROJECT PPT RAJ HZL.pdf
 
HTML - part 1
HTML - part 1HTML - part 1
HTML - part 1
 
html.pptx
html.pptxhtml.pptx
html.pptx
 
HTML
HTMLHTML
HTML
 
Web Development using HTML & CSS
Web Development using HTML & CSSWeb Development using HTML & CSS
Web Development using HTML & CSS
 
Html ppt
Html pptHtml ppt
Html ppt
 
HTML CSS.pdf
HTML CSS.pdfHTML CSS.pdf
HTML CSS.pdf
 
HTML
HTMLHTML
HTML
 
HTML (Hyper Text Markup Language)
HTML (Hyper Text Markup Language)HTML (Hyper Text Markup Language)
HTML (Hyper Text Markup Language)
 
HTML - LinkedIn
HTML - LinkedInHTML - LinkedIn
HTML - LinkedIn
 
Html, xml and java script
Html, xml and java scriptHtml, xml and java script
Html, xml and java script
 
HTML.pdf
HTML.pdfHTML.pdf
HTML.pdf
 
Introduction to Html
Introduction to HtmlIntroduction to Html
Introduction to Html
 

Recently uploaded

Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...Krashi Coaching
 
Student login on Anyboli platform.helpin
Student login on Anyboli platform.helpinStudent login on Anyboli platform.helpin
Student login on Anyboli platform.helpinRaunakKeshri1
 
POINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptx
POINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptxPOINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptx
POINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptxSayali Powar
 
Introduction to Nonprofit Accounting: The Basics
Introduction to Nonprofit Accounting: The BasicsIntroduction to Nonprofit Accounting: The Basics
Introduction to Nonprofit Accounting: The BasicsTechSoup
 
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions  for the students and aspirants of Chemistry12th.pptxOrganic Name Reactions  for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions for the students and aspirants of Chemistry12th.pptxVS Mahajan Coaching Centre
 
Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111Sapana Sha
 
Beyond the EU: DORA and NIS 2 Directive's Global Impact
Beyond the EU: DORA and NIS 2 Directive's Global ImpactBeyond the EU: DORA and NIS 2 Directive's Global Impact
Beyond the EU: DORA and NIS 2 Directive's Global ImpactPECB
 
Activity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdfActivity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdfciinovamais
 
Measures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and ModeMeasures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and ModeThiyagu K
 
Accessible design: Minimum effort, maximum impact
Accessible design: Minimum effort, maximum impactAccessible design: Minimum effort, maximum impact
Accessible design: Minimum effort, maximum impactdawncurless
 
Software Engineering Methodologies (overview)
Software Engineering Methodologies (overview)Software Engineering Methodologies (overview)
Software Engineering Methodologies (overview)eniolaolutunde
 
Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...
Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...
Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...fonyou31
 
Sanyam Choudhary Chemistry practical.pdf
Sanyam Choudhary Chemistry practical.pdfSanyam Choudhary Chemistry practical.pdf
Sanyam Choudhary Chemistry practical.pdfsanyamsingh5019
 
BAG TECHNIQUE Bag technique-a tool making use of public health bag through wh...
BAG TECHNIQUE Bag technique-a tool making use of public health bag through wh...BAG TECHNIQUE Bag technique-a tool making use of public health bag through wh...
BAG TECHNIQUE Bag technique-a tool making use of public health bag through wh...Sapna Thakur
 
The basics of sentences session 2pptx copy.pptx
The basics of sentences session 2pptx copy.pptxThe basics of sentences session 2pptx copy.pptx
The basics of sentences session 2pptx copy.pptxheathfieldcps1
 
Interactive Powerpoint_How to Master effective communication
Interactive Powerpoint_How to Master effective communicationInteractive Powerpoint_How to Master effective communication
Interactive Powerpoint_How to Master effective communicationnomboosow
 
A Critique of the Proposed National Education Policy Reform
A Critique of the Proposed National Education Policy ReformA Critique of the Proposed National Education Policy Reform
A Critique of the Proposed National Education Policy ReformChameera Dedduwage
 
Measures of Dispersion and Variability: Range, QD, AD and SD
Measures of Dispersion and Variability: Range, QD, AD and SDMeasures of Dispersion and Variability: Range, QD, AD and SD
Measures of Dispersion and Variability: Range, QD, AD and SDThiyagu K
 

Recently uploaded (20)

Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
 
Student login on Anyboli platform.helpin
Student login on Anyboli platform.helpinStudent login on Anyboli platform.helpin
Student login on Anyboli platform.helpin
 
POINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptx
POINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptxPOINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptx
POINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptx
 
Introduction to Nonprofit Accounting: The Basics
Introduction to Nonprofit Accounting: The BasicsIntroduction to Nonprofit Accounting: The Basics
Introduction to Nonprofit Accounting: The Basics
 
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions  for the students and aspirants of Chemistry12th.pptxOrganic Name Reactions  for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
 
INDIA QUIZ 2024 RLAC DELHI UNIVERSITY.pptx
INDIA QUIZ 2024 RLAC DELHI UNIVERSITY.pptxINDIA QUIZ 2024 RLAC DELHI UNIVERSITY.pptx
INDIA QUIZ 2024 RLAC DELHI UNIVERSITY.pptx
 
Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111
 
Código Creativo y Arte de Software | Unidad 1
Código Creativo y Arte de Software | Unidad 1Código Creativo y Arte de Software | Unidad 1
Código Creativo y Arte de Software | Unidad 1
 
Beyond the EU: DORA and NIS 2 Directive's Global Impact
Beyond the EU: DORA and NIS 2 Directive's Global ImpactBeyond the EU: DORA and NIS 2 Directive's Global Impact
Beyond the EU: DORA and NIS 2 Directive's Global Impact
 
Activity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdfActivity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdf
 
Measures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and ModeMeasures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and Mode
 
Accessible design: Minimum effort, maximum impact
Accessible design: Minimum effort, maximum impactAccessible design: Minimum effort, maximum impact
Accessible design: Minimum effort, maximum impact
 
Software Engineering Methodologies (overview)
Software Engineering Methodologies (overview)Software Engineering Methodologies (overview)
Software Engineering Methodologies (overview)
 
Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...
Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...
Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...
 
Sanyam Choudhary Chemistry practical.pdf
Sanyam Choudhary Chemistry practical.pdfSanyam Choudhary Chemistry practical.pdf
Sanyam Choudhary Chemistry practical.pdf
 
BAG TECHNIQUE Bag technique-a tool making use of public health bag through wh...
BAG TECHNIQUE Bag technique-a tool making use of public health bag through wh...BAG TECHNIQUE Bag technique-a tool making use of public health bag through wh...
BAG TECHNIQUE Bag technique-a tool making use of public health bag through wh...
 
The basics of sentences session 2pptx copy.pptx
The basics of sentences session 2pptx copy.pptxThe basics of sentences session 2pptx copy.pptx
The basics of sentences session 2pptx copy.pptx
 
Interactive Powerpoint_How to Master effective communication
Interactive Powerpoint_How to Master effective communicationInteractive Powerpoint_How to Master effective communication
Interactive Powerpoint_How to Master effective communication
 
A Critique of the Proposed National Education Policy Reform
A Critique of the Proposed National Education Policy ReformA Critique of the Proposed National Education Policy Reform
A Critique of the Proposed National Education Policy Reform
 
Measures of Dispersion and Variability: Range, QD, AD and SD
Measures of Dispersion and Variability: Range, QD, AD and SDMeasures of Dispersion and Variability: Range, QD, AD and SD
Measures of Dispersion and Variability: Range, QD, AD and SD
 

Session-1, Revision of HTML.pptx

  • 2. Recall Test 1. The BODY tag is usually used after A. EM Tag B. HEAD Tag C. TITLE Tag D. HTML Tag 2. Choose The Correct HTML Tag To Make A Text Italic A. <italic> B. <it> C. <i> D. <il> 3. Correct HTML Tag For The Largest Heading is A. <h6> B. <heading> C. <h1> D. <head> 4. HTML is what type of language? A. Scripting language B. Markup language
  • 3. Introduction to HTML ● Basic document structure of HTML 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>. ● Heading and its types HTML headings are defined with the <h1> to <h6> tags. <h1> defines the most important heading. <h6> defines the least important heading. ● How to create paragraph The HTML <p> element defines a paragraph. A paragraph always starts on a new line, and browsers automatically add some white space (a margin) before and after a paragraph. ● Learn to style in HTML The HTML style attribute is used to add styles to an element, such as color, font, size, and more.
  • 4. HTML Formatting ● <b> - Bold text - defines bold text, without any extra importance. ● <strong> - Important text - defines text with strong importance. ● <i> - Italic text - defines a part of text in an alternate voice or mood. ● <em> - Emphasized text - defines emphasized text. ● <mark> - Marked text - defines text that should be marked or highlighted. ● <small> - Smaller text - defines smaller text. ● <del> - Deleted text - defines text that has been deleted from a document. ● <ins> - Inserted text - defines a text that has been inserted into a document. Browsers will usually underline inserted text. ● <sub> - Subscript text - defines subscript text. Subscript text appears half a character below the normal line ● <sup> - Superscript text - defines superscript text. Superscript text appears half a character above the normal line
  • 5. HTML Phrase tags ● Marked text - Anything that appears with-in <mark>...</mark> element, is displayed as marked with yellow ink. ● Text Abbreviation - We can abbreviate a text by putting it inside opening <abbr> and closing </abbr> tags. If present, the title attribute must contain this full description and nothing else. ● Acronym element - The <acronym> element allows you to indicate that the text between <acronym> and </acronym> tags is an acronym. ● Text Direction - The <bdo>...</bdo> element stands for Bi-Directional Override and it is used to override the current text direction. ● Special terms - The <dfn>...</dfn> element (or HTML Definition Element) allows you to specify that you are introducing a special term. It's usage is similar to italic words in the midst of a paragraph. ● Quoting Text - When you want to quote a passage from another source, you should put it in between <blockquote>...</blockquote> tags. ● Text Citations - If you are quoting a text, you can indicate the source placing it between an opening <cite> tag and closing </cite> tag ● Address text - The <address>...</address> element is used to contain any address.
  • 6. HTML Images and tables A. HTML Images ● The HTML <img> tag is used to embed an image in a web page. ● The <img> tag has two required attributes: src - Specifies the path to the image. alt - Specifies an alternate text for the image. ● The required alt attribute provides an alternate text for an image. ● You can use the style attribute to specify the width and height of an image. For example, B. HTML Tables: The <table> tag defines an HTML table. Each table row is defined with a <tr> tag. Each table header is defined with a <th> tag. Each table data/cell is defined with a <td> tag. By default, the text in <th> elements are bold and centered. By default, the text in <td> elements are regular and left-aligned.
  • 7. HTML Forms An HTML form is used to collect user input which is often sent to a server for processing. ● <form> element : The HTML <form> element is used to create an HTML form for user input. It is a is a container for different types of input elements. Ex. radio, checkbox, submit, etc. ● <input> element : It is most often used attribute mostly combined with type attribute. Type Description <input type="text"> Displays a single-line text input field <input type="radio"> Displays a radio button (for selecting one of many choices) <input type="checkbox"> Displays a checkbox (for selecting zero or more of many choices) <input type="button"> Displays a clickable button <input type="submit"> Displays a checkbox (for selecting zero or more of many choices)
  • 8. Concept Test ● Explain the difference between strong and bold in html tag.(refer to HTML formatting) ● The correct sequence of HTML tags for starting a webpage is - A. Head, Title, HTML, body B. HTML, Body, Title, Head C. HTML, Head, Title, Body ● How to create an ordered list (a list with the list items in numbers) in HTML? A. <ul> B. <ol> C. <li> D. <i> ● How to create a checkbox in HTML? A. <input type = "checkbox"> B. <input type = "button"> C. <checkbox> D. <input type = "check">
  • 9. In Class exercise Creating a simple HTML story book: ● Use HTML table tag to create a structure of the book. ● Use image and phrase tags to create a storyline. ● Use HTML formatting text and font tags to elaborate your story.
  • 10. Homework Assignment Creating a simple HTML Tribute page for your favourite Avenger: ● Create a simple HTML page giving information about your fav. Avenger. ● You can then add a picture of the person you are paying tribute to using <img> tag. ● Also, add the person’s details, achievements, and so on using HTML tables.