SlideShare a Scribd company logo
1 of 37
Welcome HTML Training
Teach By :Thansare
Level: Beginner
Elements
 An HTML element usually consists of a start tag and end tag, with the content inserted in between:
<tagname>Content goes here...</tagname>
Attributes
 All HTML elements can have attributes
 Attributes provide additional information about an element
 Attributes are always specified in the start tag
 Attributes usually come in name/value pairs like: name="value"
 Type of Attributes Lange Attribute, title Attribute, href Attributes, Size Attribute, alt Attribute, Quote
Attribute values
Lang Attribute
 The language of the document can be declared in the <html> tag.
 The language is declared with the lang attribute.
 Declaring a language is important for accessibility applications (screen readers) and search engines
Title Attribute
 a title attribute is added to the <p> element. The value of the title attribute will be displayed as a
tooltip when you mouse over the paragraph
Href Attribute
 HTML links are defined with the <a> tag. The link address is specified in the href attribute
Size Attribute
 HTML images are defined with the <img> tag.
 The filename of the source (src), and the size of the image (width and height) are all provided as
attributes
Alt Attribute
 The alt attribute specifies an alternative text to be used, when an image cannot be displayed.
 The value of the attribute can be read by screen readers. This way, someone "listening" to the webpage,
e.g. a blind person, can "hear" the element.
Quote Attribute Values
 Daf
HTML Headings
 Headings are defined with the <h1> to <h6> tags.
 <h1> defines the most important heading. <h6> defines the least important heading
HTML Horizontal Rules
 The <hr> tag defines a thematic break in an HTML page, and is most often displayed as a horizontal
rule.
 The <hr> element is used to separate content (or define a change) in an HTML page
HTML<head>Element
 he HTML <head> element has nothing to do with HTML headings.
 The <head> element is a container for metadata. HTML metadata is data about the HTML document.
Metadata is not displayed.
 The <head> element is placed between the <html> tag and the <body> tag:
HTML Paragraphs
 The HTML <p> element defines a paragraph
HTML <pre>Element
 The HTML <pre> element defines preformatted text.
 The text inside a <pre> element is displayed in a fixed-width font (usually Courier), and it preserves both
spaces and line breaks
HTML Style
 Setting the style of an HTML element, can be done with the style attribute.
 The HTML style attribute has the following syntax <tagname style="property:value;">
HTML Background Color
 The background-color property defines the background color for an HTML element.
 This example sets the background color for a page to powderblue
HTML Fonts
 The font-family property defines the font to be used for an HTML element
HTML Formatting Elements
 n the previous chapter, you learned about the HTML style attribute.
 HTML also defines special elements for defining text with a special meaning.
 HTML uses elements like <b> and <i> for formatting output, like bold or italic text
HTML Quotations
 The HTML <q> element defines a short quotation.
Browsers usually insert quotation marks around the <q> element
 The HTML <blockquote> element defines a section that is quoted from another source.
Browsers usually indent <blockquote> elements
 The HTML <abbr> element defines an abbreviation or an acronym.
 Marking abbreviations can give useful information to browsers, translation systems and search-engines
 The HTML <address> element defines contact information (author/owner) of a document or an article.
 The <address> element is usually displayed in italic. Most browsers will add a line break before and after the
element.
 The HTML <cite> element defines the title of a work.
 Browsers usually display <cite> elements in italic
 The HTML <bdo> element defines bi-directional override.
 The <bdo> element is used to override the current text direction
HTML Comments
 Comment tags are used to insert comments in the HTML source code
 Notice that there is an exclamation point (!) in the opening tag, but not in the closing tag.
 Conditional comments defines some HTML tags to be executed by Internet Explorer only
HTML Colors
 In HTML, a color can be specified by using a color name, an RGB value, or a HEX value
HTML CSS
 CSS stands for Cascading Style Sheets.
 CSS describes how HTML elements are to be displayed on screen, paper, or in other media.
 CSS saves a lot of work. It can control the layout of multiple web pages all at once.
 CSS can be added to HTML elements in 3 ways:
 Inline - by using the style attribute in HTML elements
 Internal - by using a <style> element in the <head> section
 External - by using an external CSS file
HTML Links
 Links are found in nearly all web pages. Links allow users to click their way from page to page.
 Type of links: Hyper links,Local Links,links color,Image as a Link,………………
HTML Images
 In HTML, images are defined with the <img> tag.
 The <img> tag is empty, it contains attributes only, and does not have a closing tag.
 The src attribute specifies the URL (web address) of the image
HTML Tables
 An HTML table is defined with the <table> tag.
 Each table row is defined with the <tr> tag. A table header is defined with the <th> tag. By default, table
headings are bold and centered. A table data/cell is defined with the <td> tag
HTML List
 List in HTML have two types are Unordered list and Ordered list
 Type of style : disc,circle,square,noune,
 An ordered list starts with the <ol> tag. Each list item starts with the <li> tag.
 The list items will be marked with numbers by default
HTML Classes
 he HTML class attribute makes it possible to define equal styles for elements with the same class name.
 Here we have three <div> elements that point to the same class name
HTML Iframes
 An iframe is used to display a web page within a web page.
HTML Media(Video)
 Multimedia on the web is sound, music, videos, movies, and animations.
HTML Media(Audio)
 MP3 is the newest format for compressed recorded music. The term MP3 has become synonymous with
digital music.
 If your website is about recorded music, MP3 is the choice.
HTML Video Code
 Before HTML5, a video could only be played in a browser with a plug-in (like flash).
 The HTML5 <video> element specifies a standard way to embed a video in a web page
 Df

More Related Content

What's hot (20)

Webithon Workshop
Webithon WorkshopWebithon Workshop
Webithon Workshop
 
Html & Html5 from scratch
Html & Html5 from scratchHtml & Html5 from scratch
Html & Html5 from scratch
 
Lectuer html1
Lectuer  html1Lectuer  html1
Lectuer html1
 
Html
HtmlHtml
Html
 
HTML - LinkedIn
HTML - LinkedInHTML - LinkedIn
HTML - LinkedIn
 
Html training slide
Html training slideHtml training slide
Html training slide
 
Html basic
Html basicHtml basic
Html basic
 
Html
HtmlHtml
Html
 
Introduction to Cascading Style Sheets
Introduction to Cascading Style SheetsIntroduction to Cascading Style Sheets
Introduction to Cascading Style Sheets
 
Html
HtmlHtml
Html
 
Notes4
Notes4Notes4
Notes4
 
HTML (Hyper Text Markup Language) by Mukesh
HTML (Hyper Text Markup Language) by MukeshHTML (Hyper Text Markup Language) by Mukesh
HTML (Hyper Text Markup Language) by Mukesh
 
Css
CssCss
Css
 
HTML/CSS/java Script/Jquery
HTML/CSS/java Script/JqueryHTML/CSS/java Script/Jquery
HTML/CSS/java Script/Jquery
 
Web Design & Development - Session 4
Web Design & Development - Session 4Web Design & Development - Session 4
Web Design & Development - Session 4
 
O9xml
O9xmlO9xml
O9xml
 
Html, xml and java script
Html, xml and java scriptHtml, xml and java script
Html, xml and java script
 
Web Design & Development - Session 2
Web Design & Development - Session 2Web Design & Development - Session 2
Web Design & Development - Session 2
 
CSS Foundations, pt 1
CSS Foundations, pt 1CSS Foundations, pt 1
CSS Foundations, pt 1
 
Web Design & Development - Session 3
Web Design & Development - Session 3Web Design & Development - Session 3
Web Design & Development - Session 3
 

Similar to HTML Training Part1 (20)

HTML 5 Topic 2
HTML 5 Topic 2HTML 5 Topic 2
HTML 5 Topic 2
 
Higher Computing Science HTML
Higher Computing Science HTMLHigher Computing Science HTML
Higher Computing Science HTML
 
Html
HtmlHtml
Html
 
Computer fundamentals-internet p2
Computer fundamentals-internet p2Computer fundamentals-internet p2
Computer fundamentals-internet p2
 
Hyper Text Mark-up Language
Hyper Text Mark-up Language Hyper Text Mark-up Language
Hyper Text Mark-up Language
 
Html
HtmlHtml
Html
 
Html
HtmlHtml
Html
 
Html tutorials-infotech aus
Html tutorials-infotech ausHtml tutorials-infotech aus
Html tutorials-infotech aus
 
Web Development using HTML & CSS
Web Development using HTML & CSSWeb Development using HTML & CSS
Web Development using HTML & CSS
 
Html
HtmlHtml
Html
 
HTML
HTMLHTML
HTML
 
Html basics
Html basicsHtml basics
Html basics
 
Html starting
Html startingHtml starting
Html starting
 
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
 
HTML.pptx
HTML.pptxHTML.pptx
HTML.pptx
 
INTERNSHIP PROJECT PPT RAJ HZL.pdf
INTERNSHIP PROJECT PPT RAJ HZL.pdfINTERNSHIP PROJECT PPT RAJ HZL.pdf
INTERNSHIP PROJECT PPT RAJ HZL.pdf
 
Tm 1st quarter - 1st meeting
Tm   1st quarter - 1st meetingTm   1st quarter - 1st meeting
Tm 1st quarter - 1st meeting
 
Html tutorials by www.dmdiploma.com
Html tutorials by www.dmdiploma.comHtml tutorials by www.dmdiploma.com
Html tutorials by www.dmdiploma.com
 
Html presentation
Html presentationHtml presentation
Html presentation
 
html.pptx
html.pptxhtml.pptx
html.pptx
 

More from than sare

Spring review_for Semester II of Year 4
Spring review_for Semester II of Year 4Spring review_for Semester II of Year 4
Spring review_for Semester II of Year 4than sare
 
Project Management_Review_2018
Project Management_Review_2018Project Management_Review_2018
Project Management_Review_2018than sare
 
Android review_for final Semester II of Year4
Android review_for final Semester II of Year4Android review_for final Semester II of Year4
Android review_for final Semester II of Year4than sare
 
Importain questions e_commerce_preview questions
Importain questions e_commerce_preview questionsImportain questions e_commerce_preview questions
Importain questions e_commerce_preview questionsthan sare
 
E commerce preview questions23 jul-2018
E commerce preview questions23 jul-2018E commerce preview questions23 jul-2018
E commerce preview questions23 jul-2018than sare
 
Physic grade-12
Physic grade-12Physic grade-12
Physic grade-12than sare
 
Business plan
Business planBusiness plan
Business planthan sare
 
Share point review qustions
Share point review qustionsShare point review qustions
Share point review qustionsthan sare
 
Share point answer the question
Share point answer the questionShare point answer the question
Share point answer the questionthan sare
 
Judging rubric
Judging rubricJudging rubric
Judging rubricthan sare
 
Smartphone v ideo editing manual-ios(Tech By Ms.THAN Sare)
Smartphone v ideo  editing manual-ios(Tech By Ms.THAN Sare)Smartphone v ideo  editing manual-ios(Tech By Ms.THAN Sare)
Smartphone v ideo editing manual-ios(Tech By Ms.THAN Sare)than sare
 
Database(db sql) review
Database(db sql) reviewDatabase(db sql) review
Database(db sql) reviewthan sare
 
Mid term &amp; final- preparation- student-review(Oracle)
Mid term &amp; final- preparation- student-review(Oracle)Mid term &amp; final- preparation- student-review(Oracle)
Mid term &amp; final- preparation- student-review(Oracle)than sare
 
Answer ado.net pre-exam2018
Answer ado.net pre-exam2018Answer ado.net pre-exam2018
Answer ado.net pre-exam2018than sare
 
Review oop and ood
Review oop and oodReview oop and ood
Review oop and oodthan sare
 
Technovation week6 planning_yourcode
Technovation week6 planning_yourcodeTechnovation week6 planning_yourcode
Technovation week6 planning_yourcodethan sare
 
Sen sors(technovation) week6_thansare
Sen sors(technovation) week6_thansareSen sors(technovation) week6_thansare
Sen sors(technovation) week6_thansarethan sare
 
Week5(technovation)-Teach by Mr.than Sare
Week5(technovation)-Teach by Mr.than SareWeek5(technovation)-Teach by Mr.than Sare
Week5(technovation)-Teach by Mr.than Sarethan sare
 
App inventor week4(technovation)
App inventor week4(technovation)App inventor week4(technovation)
App inventor week4(technovation)than sare
 

More from than sare (20)

Spring review_for Semester II of Year 4
Spring review_for Semester II of Year 4Spring review_for Semester II of Year 4
Spring review_for Semester II of Year 4
 
Project Management_Review_2018
Project Management_Review_2018Project Management_Review_2018
Project Management_Review_2018
 
Android review_for final Semester II of Year4
Android review_for final Semester II of Year4Android review_for final Semester II of Year4
Android review_for final Semester II of Year4
 
Importain questions e_commerce_preview questions
Importain questions e_commerce_preview questionsImportain questions e_commerce_preview questions
Importain questions e_commerce_preview questions
 
E commerce preview questions23 jul-2018
E commerce preview questions23 jul-2018E commerce preview questions23 jul-2018
E commerce preview questions23 jul-2018
 
Physic 12-2
Physic 12-2Physic 12-2
Physic 12-2
 
Physic grade-12
Physic grade-12Physic grade-12
Physic grade-12
 
Business plan
Business planBusiness plan
Business plan
 
Share point review qustions
Share point review qustionsShare point review qustions
Share point review qustions
 
Share point answer the question
Share point answer the questionShare point answer the question
Share point answer the question
 
Judging rubric
Judging rubricJudging rubric
Judging rubric
 
Smartphone v ideo editing manual-ios(Tech By Ms.THAN Sare)
Smartphone v ideo  editing manual-ios(Tech By Ms.THAN Sare)Smartphone v ideo  editing manual-ios(Tech By Ms.THAN Sare)
Smartphone v ideo editing manual-ios(Tech By Ms.THAN Sare)
 
Database(db sql) review
Database(db sql) reviewDatabase(db sql) review
Database(db sql) review
 
Mid term &amp; final- preparation- student-review(Oracle)
Mid term &amp; final- preparation- student-review(Oracle)Mid term &amp; final- preparation- student-review(Oracle)
Mid term &amp; final- preparation- student-review(Oracle)
 
Answer ado.net pre-exam2018
Answer ado.net pre-exam2018Answer ado.net pre-exam2018
Answer ado.net pre-exam2018
 
Review oop and ood
Review oop and oodReview oop and ood
Review oop and ood
 
Technovation week6 planning_yourcode
Technovation week6 planning_yourcodeTechnovation week6 planning_yourcode
Technovation week6 planning_yourcode
 
Sen sors(technovation) week6_thansare
Sen sors(technovation) week6_thansareSen sors(technovation) week6_thansare
Sen sors(technovation) week6_thansare
 
Week5(technovation)-Teach by Mr.than Sare
Week5(technovation)-Teach by Mr.than SareWeek5(technovation)-Teach by Mr.than Sare
Week5(technovation)-Teach by Mr.than Sare
 
App inventor week4(technovation)
App inventor week4(technovation)App inventor week4(technovation)
App inventor week4(technovation)
 

Recently uploaded

Crayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon ACrayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon AUnboundStockton
 
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK  LOOKBOOK(1) (1).pdfBASLIQ CURRENT LOOKBOOK  LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdfSoniaTolstoy
 
The Most Excellent Way | 1 Corinthians 13
The Most Excellent Way | 1 Corinthians 13The Most Excellent Way | 1 Corinthians 13
The Most Excellent Way | 1 Corinthians 13Steve Thomason
 
Employee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptxEmployee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptxNirmalaLoungPoorunde1
 
Arihant handbook biology for class 11 .pdf
Arihant handbook biology for class 11 .pdfArihant handbook biology for class 11 .pdf
Arihant handbook biology for class 11 .pdfchloefrazer622
 
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991RKavithamani
 
URLs and Routing in the Odoo 17 Website App
URLs and Routing in the Odoo 17 Website AppURLs and Routing in the Odoo 17 Website App
URLs and Routing in the Odoo 17 Website AppCeline George
 
Software Engineering Methodologies (overview)
Software Engineering Methodologies (overview)Software Engineering Methodologies (overview)
Software Engineering Methodologies (overview)eniolaolutunde
 
Micromeritics - Fundamental and Derived Properties of Powders
Micromeritics - Fundamental and Derived Properties of PowdersMicromeritics - Fundamental and Derived Properties of Powders
Micromeritics - Fundamental and Derived Properties of PowdersChitralekhaTherkar
 
18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf
18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf
18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdfssuser54595a
 
MENTAL STATUS EXAMINATION format.docx
MENTAL     STATUS EXAMINATION format.docxMENTAL     STATUS EXAMINATION format.docx
MENTAL STATUS EXAMINATION format.docxPoojaSen20
 
Introduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxIntroduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxpboyjonauth
 
Separation of Lanthanides/ Lanthanides and Actinides
Separation of Lanthanides/ Lanthanides and ActinidesSeparation of Lanthanides/ Lanthanides and Actinides
Separation of Lanthanides/ Lanthanides and ActinidesFatimaKhan178732
 
Science 7 - LAND and SEA BREEZE and its Characteristics
Science 7 - LAND and SEA BREEZE and its CharacteristicsScience 7 - LAND and SEA BREEZE and its Characteristics
Science 7 - LAND and SEA BREEZE and its CharacteristicsKarinaGenton
 
Introduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher EducationIntroduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher Educationpboyjonauth
 
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
 
CARE OF CHILD IN INCUBATOR..........pptx
CARE OF CHILD IN INCUBATOR..........pptxCARE OF CHILD IN INCUBATOR..........pptx
CARE OF CHILD IN INCUBATOR..........pptxGaneshChakor2
 

Recently uploaded (20)

Crayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon ACrayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon A
 
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
 
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK  LOOKBOOK(1) (1).pdfBASLIQ CURRENT LOOKBOOK  LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
 
The Most Excellent Way | 1 Corinthians 13
The Most Excellent Way | 1 Corinthians 13The Most Excellent Way | 1 Corinthians 13
The Most Excellent Way | 1 Corinthians 13
 
Employee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptxEmployee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptx
 
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
TataKelola dan KamSiber Kecerdasan Buatan v022.pdfTataKelola dan KamSiber Kecerdasan Buatan v022.pdf
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
 
Arihant handbook biology for class 11 .pdf
Arihant handbook biology for class 11 .pdfArihant handbook biology for class 11 .pdf
Arihant handbook biology for class 11 .pdf
 
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
 
URLs and Routing in the Odoo 17 Website App
URLs and Routing in the Odoo 17 Website AppURLs and Routing in the Odoo 17 Website App
URLs and Routing in the Odoo 17 Website App
 
Software Engineering Methodologies (overview)
Software Engineering Methodologies (overview)Software Engineering Methodologies (overview)
Software Engineering Methodologies (overview)
 
Micromeritics - Fundamental and Derived Properties of Powders
Micromeritics - Fundamental and Derived Properties of PowdersMicromeritics - Fundamental and Derived Properties of Powders
Micromeritics - Fundamental and Derived Properties of Powders
 
18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf
18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf
18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf
 
Model Call Girl in Tilak Nagar Delhi reach out to us at 🔝9953056974🔝
Model Call Girl in Tilak Nagar Delhi reach out to us at 🔝9953056974🔝Model Call Girl in Tilak Nagar Delhi reach out to us at 🔝9953056974🔝
Model Call Girl in Tilak Nagar Delhi reach out to us at 🔝9953056974🔝
 
MENTAL STATUS EXAMINATION format.docx
MENTAL     STATUS EXAMINATION format.docxMENTAL     STATUS EXAMINATION format.docx
MENTAL STATUS EXAMINATION format.docx
 
Introduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxIntroduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptx
 
Separation of Lanthanides/ Lanthanides and Actinides
Separation of Lanthanides/ Lanthanides and ActinidesSeparation of Lanthanides/ Lanthanides and Actinides
Separation of Lanthanides/ Lanthanides and Actinides
 
Science 7 - LAND and SEA BREEZE and its Characteristics
Science 7 - LAND and SEA BREEZE and its CharacteristicsScience 7 - LAND and SEA BREEZE and its Characteristics
Science 7 - LAND and SEA BREEZE and its Characteristics
 
Introduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher EducationIntroduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher Education
 
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
 
CARE OF CHILD IN INCUBATOR..........pptx
CARE OF CHILD IN INCUBATOR..........pptxCARE OF CHILD IN INCUBATOR..........pptx
CARE OF CHILD IN INCUBATOR..........pptx
 

HTML Training Part1

  • 1. Welcome HTML Training Teach By :Thansare Level: Beginner
  • 2. Elements  An HTML element usually consists of a start tag and end tag, with the content inserted in between: <tagname>Content goes here...</tagname>
  • 3. Attributes  All HTML elements can have attributes  Attributes provide additional information about an element  Attributes are always specified in the start tag  Attributes usually come in name/value pairs like: name="value"  Type of Attributes Lange Attribute, title Attribute, href Attributes, Size Attribute, alt Attribute, Quote Attribute values
  • 4. Lang Attribute  The language of the document can be declared in the <html> tag.  The language is declared with the lang attribute.  Declaring a language is important for accessibility applications (screen readers) and search engines
  • 5. Title Attribute  a title attribute is added to the <p> element. The value of the title attribute will be displayed as a tooltip when you mouse over the paragraph
  • 6. Href Attribute  HTML links are defined with the <a> tag. The link address is specified in the href attribute
  • 7. Size Attribute  HTML images are defined with the <img> tag.  The filename of the source (src), and the size of the image (width and height) are all provided as attributes
  • 8. Alt Attribute  The alt attribute specifies an alternative text to be used, when an image cannot be displayed.  The value of the attribute can be read by screen readers. This way, someone "listening" to the webpage, e.g. a blind person, can "hear" the element.
  • 10. HTML Headings  Headings are defined with the <h1> to <h6> tags.  <h1> defines the most important heading. <h6> defines the least important heading
  • 11. HTML Horizontal Rules  The <hr> tag defines a thematic break in an HTML page, and is most often displayed as a horizontal rule.  The <hr> element is used to separate content (or define a change) in an HTML page
  • 12. HTML<head>Element  he HTML <head> element has nothing to do with HTML headings.  The <head> element is a container for metadata. HTML metadata is data about the HTML document. Metadata is not displayed.  The <head> element is placed between the <html> tag and the <body> tag:
  • 13. HTML Paragraphs  The HTML <p> element defines a paragraph
  • 14. HTML <pre>Element  The HTML <pre> element defines preformatted text.  The text inside a <pre> element is displayed in a fixed-width font (usually Courier), and it preserves both spaces and line breaks
  • 15. HTML Style  Setting the style of an HTML element, can be done with the style attribute.  The HTML style attribute has the following syntax <tagname style="property:value;">
  • 16. HTML Background Color  The background-color property defines the background color for an HTML element.  This example sets the background color for a page to powderblue
  • 17. HTML Fonts  The font-family property defines the font to be used for an HTML element
  • 18. HTML Formatting Elements  n the previous chapter, you learned about the HTML style attribute.  HTML also defines special elements for defining text with a special meaning.  HTML uses elements like <b> and <i> for formatting output, like bold or italic text
  • 19. HTML Quotations  The HTML <q> element defines a short quotation. Browsers usually insert quotation marks around the <q> element  The HTML <blockquote> element defines a section that is quoted from another source. Browsers usually indent <blockquote> elements
  • 20.  The HTML <abbr> element defines an abbreviation or an acronym.  Marking abbreviations can give useful information to browsers, translation systems and search-engines
  • 21.  The HTML <address> element defines contact information (author/owner) of a document or an article.  The <address> element is usually displayed in italic. Most browsers will add a line break before and after the element.
  • 22.  The HTML <cite> element defines the title of a work.  Browsers usually display <cite> elements in italic
  • 23.  The HTML <bdo> element defines bi-directional override.  The <bdo> element is used to override the current text direction
  • 24. HTML Comments  Comment tags are used to insert comments in the HTML source code  Notice that there is an exclamation point (!) in the opening tag, but not in the closing tag.  Conditional comments defines some HTML tags to be executed by Internet Explorer only
  • 25. HTML Colors  In HTML, a color can be specified by using a color name, an RGB value, or a HEX value
  • 26. HTML CSS  CSS stands for Cascading Style Sheets.  CSS describes how HTML elements are to be displayed on screen, paper, or in other media.  CSS saves a lot of work. It can control the layout of multiple web pages all at once.  CSS can be added to HTML elements in 3 ways:  Inline - by using the style attribute in HTML elements  Internal - by using a <style> element in the <head> section  External - by using an external CSS file
  • 27. HTML Links  Links are found in nearly all web pages. Links allow users to click their way from page to page.  Type of links: Hyper links,Local Links,links color,Image as a Link,………………
  • 28. HTML Images  In HTML, images are defined with the <img> tag.  The <img> tag is empty, it contains attributes only, and does not have a closing tag.  The src attribute specifies the URL (web address) of the image
  • 29. HTML Tables  An HTML table is defined with the <table> tag.  Each table row is defined with the <tr> tag. A table header is defined with the <th> tag. By default, table headings are bold and centered. A table data/cell is defined with the <td> tag
  • 30. HTML List  List in HTML have two types are Unordered list and Ordered list  Type of style : disc,circle,square,noune,
  • 31.  An ordered list starts with the <ol> tag. Each list item starts with the <li> tag.  The list items will be marked with numbers by default
  • 32. HTML Classes  he HTML class attribute makes it possible to define equal styles for elements with the same class name.  Here we have three <div> elements that point to the same class name
  • 33. HTML Iframes  An iframe is used to display a web page within a web page.
  • 34. HTML Media(Video)  Multimedia on the web is sound, music, videos, movies, and animations.
  • 35. HTML Media(Audio)  MP3 is the newest format for compressed recorded music. The term MP3 has become synonymous with digital music.  If your website is about recorded music, MP3 is the choice.
  • 36. HTML Video Code  Before HTML5, a video could only be played in a browser with a plug-in (like flash).  The HTML5 <video> element specifies a standard way to embed a video in a web page