SlideShare a Scribd company logo
1 of 18
Download to read offline
www.eshikshak.co.in
Introduction to HTML
•   HTML stands for Hyper Text Markup Language
•   Language interpreted by a web browser
•   Web-pages are also called HTML Documents.
•   It defines the structure and layout of a Web
    document by using a variety of tags and
    attributes.



                                   www.eshikshak.co.in
Features of HTML
• Create a Web page using tags.
• Use graphics and display text in different fonts, sizes, and
  color.
• Enhance the presentation of the document using HTML
  elements.
• Create hyperlinks to navigate to different documents
  present on the Web.
• Display data in a tabular format.
• Create multiple windows in a Web page to display
  information from multiple sources in different windows

                                             www.eshikshak.co.in
HTML tags
• A command inserted in a document that
  specifies how the document, or a portion of
  the document, should be formatted.
• HTML tags begin with an open angle bracket
  (<) and end with a close angle bracket (>).
• HTML tags are of two types
  – Paired Tags
  – Singular Tags

                                 www.eshikshak.co.in
HTML attributes
• A language construct that programmers use
  to add additional information (i.e., metadata)
  to code elements (e.g., assemblies, modules,
  members, types, return values, and
  parameters) to extend their functionality.
• Attributes are written immediately following
  the tag
• Multiple attributes can be associated

                                   www.eshikshak.co.in
Types of HTML tag – Paired tag
• A tag is said to be a paired tag if the text is
  placed between a tag and its companion tag.
• In paired tags, the first tag is referred to as
  Opening Tag and the second tag is referred to
  as Closing Tag.
  – Example: <i>This text is in italics. </i>
  – Note: Here,
     • <i> is called opening tag
     • </i>          is       called   closing         tag.

                                           www.eshikshak.co.in
Types of HTML tag – Singular tag
• A standalone tag does not have a companinon
  tag.



  – Example: <BR /> - This tag will insert a line break
  – This tag does not require any companion tag.




                                         www.eshikshak.co.in
The structure of HTML document
<html>                                   This page is written in HTML
  <head>                                 Head tag contians information
       <title>                           about web page

                 Title of the web page                    title tag contains
      </title>                                            title of a web page

  </head>
                                         body tag contains contents of
  <body>                                 web page
       Content of the Page
       <address> Your address </address>                  This is the footer of
                                                          the web page
  </body>
</html>
                                                            www.eshikshak.co.in
The structure of HTML document
• The basic structure for all HTML documents is
  simple and should include the following
  minimum elements or tags:
  – <html> : The main container for HTML pages
  – <head> : The container for page header
    information
  – <title> : The title of the page
  – <body> : The main body of the page


                                  www.eshikshak.co.in
DOCTYPE
• The HTML !doctype tag is used for specifying
  which version of HTML the document is using.
  This is referred to as the document type
  declaration (DTD).
• <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
  Transitional//EN“ "http://www.w3.
  org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  <html>




                                         www.eshikshak.co.in
The <html> Element
• The <html> element is the containing element
  for the whole HTML document. Each HTML
  document should have one <html> and each
  document should end with a closing </html>
  tag.
• Following two elements appear as direct
  children of an <html> element:
  – <head>
  – <body>
                                 www.eshikshak.co.in
The <head> Element
• The <head> element is just a container for all
  other header elements.

• It should be the first thing to appear after the
  opening <html> tag.

• Each <head> element should contain a <title>
  element indicating the title of the document

                                    www.eshikshak.co.in
The <head> Element
• The <title> tag is used to give title to the document.

• The <link> tag is used to link to an external file, such
  as a style sheet or JavaScript file.

• The <style> tag is used to include CSS rules inside the
  document.

• The <script> tag is used to include JAVAScript or
  VBScript inside the document.
                                          www.eshikshak.co.in
The <head> Element
• The <base> tag is used to create a "base" url for all
  links on the page.

• The <object> tag is designed to include images,
  JavaScript objects, Flash animations, MP3 files,
  QuickTime movies and other components of a page.




                                        www.eshikshak.co.in
The <title> Element:
• To specify a title for every page that you write
  inside the <title> element.
• This element is a child of the <head> element.
• It is used in several ways:
  – It displays at the very top of a browser window.
  – It is used as the default name for a bookmark in
    browsers such as IE and Netscape.
  – Its is used by search engines that use its content
    to help index pages.
                                       www.eshikshak.co.in
The <title> Element:
• Here is the example of using title tag.

  <html>
        <head>
              <title>Welcome to MyWebsite</title>
        </head>
  </html>




                                        www.eshikshak.co.in
The <body> Element:
• The <body> element appears after the <head>
  element.
• It contains the part of the Web page that you
  actually see in the main browser window.
• A <body> element may contain anything from
  a couple of paragraphs under a heading to
  more complicated layouts containing forms
  and tables.

                                  www.eshikshak.co.in
The <body> Element:
• Here is the example of using body tag.
  <html>
        <head>
              <title>Welcome to MyWebsite</title>
        </head>

        <body>
              You are welcome to MyWebsite.
        </body>
  </html>


                                       www.eshikshak.co.in

More Related Content

What's hot (20)

Cascading Style Sheet (CSS)
Cascading Style Sheet (CSS)Cascading Style Sheet (CSS)
Cascading Style Sheet (CSS)
 
Introduction to html
Introduction to htmlIntroduction to html
Introduction to html
 
Xml
XmlXml
Xml
 
Html
HtmlHtml
Html
 
html-table
html-tablehtml-table
html-table
 
Basic HTML
Basic HTMLBasic HTML
Basic HTML
 
Basic html structure
Basic html structureBasic html structure
Basic html structure
 
HTML Forms
HTML FormsHTML Forms
HTML Forms
 
CSS for Beginners
CSS for BeginnersCSS for Beginners
CSS for Beginners
 
Html coding
Html codingHtml coding
Html coding
 
Learn html Basics
Learn html BasicsLearn html Basics
Learn html Basics
 
Html form tag
Html form tagHtml form tag
Html form tag
 
Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTML
 
Dhtml ppt (2)
Dhtml ppt (2)Dhtml ppt (2)
Dhtml ppt (2)
 
Html ppt computer
Html ppt computerHtml ppt computer
Html ppt computer
 
Html Ppt
Html PptHtml Ppt
Html Ppt
 
Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTML
 
Cascading Style Sheets - Part 01
Cascading Style Sheets - Part 01Cascading Style Sheets - Part 01
Cascading Style Sheets - Part 01
 
Html images syntax
Html images syntaxHtml images syntax
Html images syntax
 
CSS
CSSCSS
CSS
 

Viewers also liked

Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTMLMayaLisa
 
Lesson 1: Introduction to HTML
Lesson 1: Introduction to HTMLLesson 1: Introduction to HTML
Lesson 1: Introduction to HTMLOlivia Moran
 
HTML presentation for beginners
HTML presentation for beginnersHTML presentation for beginners
HTML presentation for beginnersjeroenvdmeer
 
Html for beginners part I
Html for beginners part IHtml for beginners part I
Html for beginners part IUnaib Aslam
 
Mesics lecture 5 input – output in ‘c’
Mesics lecture 5   input – output in ‘c’Mesics lecture 5   input – output in ‘c’
Mesics lecture 5 input – output in ‘c’eShikshak
 
Html phrase tags
Html phrase tagsHtml phrase tags
Html phrase tagseShikshak
 
Lecture15 comparisonoftheloopcontrolstructures.ppt
Lecture15 comparisonoftheloopcontrolstructures.pptLecture15 comparisonoftheloopcontrolstructures.ppt
Lecture15 comparisonoftheloopcontrolstructures.ppteShikshak
 
Lecture21 categoriesof userdefinedfunctions.ppt
Lecture21 categoriesof userdefinedfunctions.pptLecture21 categoriesof userdefinedfunctions.ppt
Lecture21 categoriesof userdefinedfunctions.ppteShikshak
 
Mesics lecture 3 c – constants and variables
Mesics lecture 3   c – constants and variablesMesics lecture 3   c – constants and variables
Mesics lecture 3 c – constants and variableseShikshak
 
Lecture 7 relational_and_logical_operators
Lecture 7 relational_and_logical_operatorsLecture 7 relational_and_logical_operators
Lecture 7 relational_and_logical_operatorseShikshak
 
Lecture7relationalandlogicaloperators 110823181038-phpapp02
Lecture7relationalandlogicaloperators 110823181038-phpapp02Lecture7relationalandlogicaloperators 110823181038-phpapp02
Lecture7relationalandlogicaloperators 110823181038-phpapp02eShikshak
 
Mesics lecture files in 'c'
Mesics lecture   files in 'c'Mesics lecture   files in 'c'
Mesics lecture files in 'c'eShikshak
 
Mesics lecture 7 iteration and repetitive executions
Mesics lecture 7   iteration and repetitive executionsMesics lecture 7   iteration and repetitive executions
Mesics lecture 7 iteration and repetitive executionseShikshak
 
Unit 1.3 types of cloud
Unit 1.3 types of cloudUnit 1.3 types of cloud
Unit 1.3 types of cloudeShikshak
 
Mesics lecture 8 arrays in 'c'
Mesics lecture 8   arrays in 'c'Mesics lecture 8   arrays in 'c'
Mesics lecture 8 arrays in 'c'eShikshak
 
Unit 1.1 introduction to cloud computing
Unit 1.1   introduction to cloud computingUnit 1.1   introduction to cloud computing
Unit 1.1 introduction to cloud computingeShikshak
 

Viewers also liked (20)

Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTML
 
Lesson 1: Introduction to HTML
Lesson 1: Introduction to HTMLLesson 1: Introduction to HTML
Lesson 1: Introduction to HTML
 
HTML presentation for beginners
HTML presentation for beginnersHTML presentation for beginners
HTML presentation for beginners
 
Internet and html
Internet and htmlInternet and html
Internet and html
 
1. HTML
1. HTML1. HTML
1. HTML
 
HTML Introduction
HTML IntroductionHTML Introduction
HTML Introduction
 
Html for beginners part I
Html for beginners part IHtml for beginners part I
Html for beginners part I
 
Mesics lecture 5 input – output in ‘c’
Mesics lecture 5   input – output in ‘c’Mesics lecture 5   input – output in ‘c’
Mesics lecture 5 input – output in ‘c’
 
Html phrase tags
Html phrase tagsHtml phrase tags
Html phrase tags
 
Lecture15 comparisonoftheloopcontrolstructures.ppt
Lecture15 comparisonoftheloopcontrolstructures.pptLecture15 comparisonoftheloopcontrolstructures.ppt
Lecture15 comparisonoftheloopcontrolstructures.ppt
 
Lecture21 categoriesof userdefinedfunctions.ppt
Lecture21 categoriesof userdefinedfunctions.pptLecture21 categoriesof userdefinedfunctions.ppt
Lecture21 categoriesof userdefinedfunctions.ppt
 
Mesics lecture 3 c – constants and variables
Mesics lecture 3   c – constants and variablesMesics lecture 3   c – constants and variables
Mesics lecture 3 c – constants and variables
 
Lecture 7 relational_and_logical_operators
Lecture 7 relational_and_logical_operatorsLecture 7 relational_and_logical_operators
Lecture 7 relational_and_logical_operators
 
Lecture7relationalandlogicaloperators 110823181038-phpapp02
Lecture7relationalandlogicaloperators 110823181038-phpapp02Lecture7relationalandlogicaloperators 110823181038-phpapp02
Lecture7relationalandlogicaloperators 110823181038-phpapp02
 
Mesics lecture files in 'c'
Mesics lecture   files in 'c'Mesics lecture   files in 'c'
Mesics lecture files in 'c'
 
Algorithm
AlgorithmAlgorithm
Algorithm
 
Mesics lecture 7 iteration and repetitive executions
Mesics lecture 7   iteration and repetitive executionsMesics lecture 7   iteration and repetitive executions
Mesics lecture 7 iteration and repetitive executions
 
Unit 1.3 types of cloud
Unit 1.3 types of cloudUnit 1.3 types of cloud
Unit 1.3 types of cloud
 
Mesics lecture 8 arrays in 'c'
Mesics lecture 8   arrays in 'c'Mesics lecture 8   arrays in 'c'
Mesics lecture 8 arrays in 'c'
 
Unit 1.1 introduction to cloud computing
Unit 1.1   introduction to cloud computingUnit 1.1   introduction to cloud computing
Unit 1.1 introduction to cloud computing
 

Similar to Introduction to html

What is HTML - An Introduction to HTML (Hypertext Markup Language)
What is HTML - An Introduction to HTML (Hypertext Markup Language)What is HTML - An Introduction to HTML (Hypertext Markup Language)
What is HTML - An Introduction to HTML (Hypertext Markup Language)Ahsan Rahim
 
Web Page Designing
Web Page DesigningWeb Page Designing
Web Page DesigningAmit Mali
 
Intro to html revised2
Intro to html revised2Intro to html revised2
Intro to html revised2mmvidanes29
 
Intr to-html-xhtml-1233508169541646-3
Intr to-html-xhtml-1233508169541646-3Intr to-html-xhtml-1233508169541646-3
Intr to-html-xhtml-1233508169541646-3bluejayjunior
 
Web technologies-course 02.pptx
Web technologies-course 02.pptxWeb technologies-course 02.pptx
Web technologies-course 02.pptxStefan Oprea
 
BITM3730Week1.pptx
BITM3730Week1.pptxBITM3730Week1.pptx
BITM3730Week1.pptxMattMarino13
 
Web forms and html (lect 1)
Web forms and html (lect 1)Web forms and html (lect 1)
Web forms and html (lect 1)Salman Memon
 
Introduction to html course digital markerters
Introduction to html course digital markertersIntroduction to html course digital markerters
Introduction to html course digital markertersSEO SKills
 
Web design - HTML (Hypertext Markup Language) introduction
Web design - HTML (Hypertext Markup Language) introductionWeb design - HTML (Hypertext Markup Language) introduction
Web design - HTML (Hypertext Markup Language) introductionMustafa Kamel Mohammadi
 
HTML 5_cfbe4b8d-092saawww24bb33cb2358.pptx
HTML 5_cfbe4b8d-092saawww24bb33cb2358.pptxHTML 5_cfbe4b8d-092saawww24bb33cb2358.pptx
HTML 5_cfbe4b8d-092saawww24bb33cb2358.pptxTEJASARGADE5
 
3 1-html-fundamentals-110302100520-phpapp02
3 1-html-fundamentals-110302100520-phpapp023 1-html-fundamentals-110302100520-phpapp02
3 1-html-fundamentals-110302100520-phpapp02Aditya Varma
 
Xhtml and html5 basics
Xhtml and html5 basicsXhtml and html5 basics
Xhtml and html5 basicsmessinam
 

Similar to Introduction to html (20)

Html intro
Html introHtml intro
Html intro
 
HTML & CSS.ppt
HTML & CSS.pptHTML & CSS.ppt
HTML & CSS.ppt
 
What is HTML - An Introduction to HTML (Hypertext Markup Language)
What is HTML - An Introduction to HTML (Hypertext Markup Language)What is HTML - An Introduction to HTML (Hypertext Markup Language)
What is HTML - An Introduction to HTML (Hypertext Markup Language)
 
Web Page Designing
Web Page DesigningWeb Page Designing
Web Page Designing
 
Intro to html revised2
Intro to html revised2Intro to html revised2
Intro to html revised2
 
Html5 css3
Html5 css3Html5 css3
Html5 css3
 
Intr to-html-xhtml-1233508169541646-3
Intr to-html-xhtml-1233508169541646-3Intr to-html-xhtml-1233508169541646-3
Intr to-html-xhtml-1233508169541646-3
 
Web technologies-course 02.pptx
Web technologies-course 02.pptxWeb technologies-course 02.pptx
Web technologies-course 02.pptx
 
Introduction to html
Introduction to htmlIntroduction to html
Introduction to html
 
Html5.pptx
Html5.pptxHtml5.pptx
Html5.pptx
 
BITM3730Week1.pptx
BITM3730Week1.pptxBITM3730Week1.pptx
BITM3730Week1.pptx
 
Web forms and html (lect 1)
Web forms and html (lect 1)Web forms and html (lect 1)
Web forms and html (lect 1)
 
Introduction to html course digital markerters
Introduction to html course digital markertersIntroduction to html course digital markerters
Introduction to html course digital markerters
 
Web design - HTML (Hypertext Markup Language) introduction
Web design - HTML (Hypertext Markup Language) introductionWeb design - HTML (Hypertext Markup Language) introduction
Web design - HTML (Hypertext Markup Language) introduction
 
html
htmlhtml
html
 
HTML 5_cfbe4b8d-092saawww24bb33cb2358.pptx
HTML 5_cfbe4b8d-092saawww24bb33cb2358.pptxHTML 5_cfbe4b8d-092saawww24bb33cb2358.pptx
HTML 5_cfbe4b8d-092saawww24bb33cb2358.pptx
 
HTML Fundamentals
HTML FundamentalsHTML Fundamentals
HTML Fundamentals
 
3 1-html-fundamentals-110302100520-phpapp02
3 1-html-fundamentals-110302100520-phpapp023 1-html-fundamentals-110302100520-phpapp02
3 1-html-fundamentals-110302100520-phpapp02
 
Html Workshop
Html WorkshopHtml Workshop
Html Workshop
 
Xhtml and html5 basics
Xhtml and html5 basicsXhtml and html5 basics
Xhtml and html5 basics
 

More from eShikshak

Modelling and evaluation
Modelling and evaluationModelling and evaluation
Modelling and evaluationeShikshak
 
Operators in python
Operators in pythonOperators in python
Operators in pythoneShikshak
 
Datatypes in python
Datatypes in pythonDatatypes in python
Datatypes in pythoneShikshak
 
Introduction to python
Introduction to pythonIntroduction to python
Introduction to pythoneShikshak
 
Introduction to e commerce
Introduction to e commerceIntroduction to e commerce
Introduction to e commerceeShikshak
 
Chapeter 2 introduction to cloud computing
Chapeter 2   introduction to cloud computingChapeter 2   introduction to cloud computing
Chapeter 2 introduction to cloud computingeShikshak
 
Unit 1.4 working of cloud computing
Unit 1.4 working of cloud computingUnit 1.4 working of cloud computing
Unit 1.4 working of cloud computingeShikshak
 
Unit 1.2 move to cloud computing
Unit 1.2   move to cloud computingUnit 1.2   move to cloud computing
Unit 1.2 move to cloud computingeShikshak
 
Mesics lecture 6 control statement = if -else if__else
Mesics lecture 6   control statement = if -else if__elseMesics lecture 6   control statement = if -else if__else
Mesics lecture 6 control statement = if -else if__elseeShikshak
 
Mesics lecture 4 c operators and experssions
Mesics lecture  4   c operators and experssionsMesics lecture  4   c operators and experssions
Mesics lecture 4 c operators and experssionseShikshak
 
Mesics lecture 5 input – output in ‘c’
Mesics lecture 5   input – output in ‘c’Mesics lecture 5   input – output in ‘c’
Mesics lecture 5 input – output in ‘c’eShikshak
 
Lecture20 user definedfunctions.ppt
Lecture20 user definedfunctions.pptLecture20 user definedfunctions.ppt
Lecture20 user definedfunctions.ppteShikshak
 
Lecture18 structurein c.ppt
Lecture18 structurein c.pptLecture18 structurein c.ppt
Lecture18 structurein c.ppteShikshak
 
Lecture17 arrays.ppt
Lecture17 arrays.pptLecture17 arrays.ppt
Lecture17 arrays.ppteShikshak
 
Lecture13 control statementswitch.ppt
Lecture13 control statementswitch.pptLecture13 control statementswitch.ppt
Lecture13 control statementswitch.ppteShikshak
 
Lecturer23 pointersin c.ppt
Lecturer23 pointersin c.pptLecturer23 pointersin c.ppt
Lecturer23 pointersin c.ppteShikshak
 
Lecture19 unionsin c.ppt
Lecture19 unionsin c.pptLecture19 unionsin c.ppt
Lecture19 unionsin c.ppteShikshak
 
Program development cyle
Program development cyleProgram development cyle
Program development cyleeShikshak
 
Language processors
Language processorsLanguage processors
Language processorseShikshak
 

More from eShikshak (19)

Modelling and evaluation
Modelling and evaluationModelling and evaluation
Modelling and evaluation
 
Operators in python
Operators in pythonOperators in python
Operators in python
 
Datatypes in python
Datatypes in pythonDatatypes in python
Datatypes in python
 
Introduction to python
Introduction to pythonIntroduction to python
Introduction to python
 
Introduction to e commerce
Introduction to e commerceIntroduction to e commerce
Introduction to e commerce
 
Chapeter 2 introduction to cloud computing
Chapeter 2   introduction to cloud computingChapeter 2   introduction to cloud computing
Chapeter 2 introduction to cloud computing
 
Unit 1.4 working of cloud computing
Unit 1.4 working of cloud computingUnit 1.4 working of cloud computing
Unit 1.4 working of cloud computing
 
Unit 1.2 move to cloud computing
Unit 1.2   move to cloud computingUnit 1.2   move to cloud computing
Unit 1.2 move to cloud computing
 
Mesics lecture 6 control statement = if -else if__else
Mesics lecture 6   control statement = if -else if__elseMesics lecture 6   control statement = if -else if__else
Mesics lecture 6 control statement = if -else if__else
 
Mesics lecture 4 c operators and experssions
Mesics lecture  4   c operators and experssionsMesics lecture  4   c operators and experssions
Mesics lecture 4 c operators and experssions
 
Mesics lecture 5 input – output in ‘c’
Mesics lecture 5   input – output in ‘c’Mesics lecture 5   input – output in ‘c’
Mesics lecture 5 input – output in ‘c’
 
Lecture20 user definedfunctions.ppt
Lecture20 user definedfunctions.pptLecture20 user definedfunctions.ppt
Lecture20 user definedfunctions.ppt
 
Lecture18 structurein c.ppt
Lecture18 structurein c.pptLecture18 structurein c.ppt
Lecture18 structurein c.ppt
 
Lecture17 arrays.ppt
Lecture17 arrays.pptLecture17 arrays.ppt
Lecture17 arrays.ppt
 
Lecture13 control statementswitch.ppt
Lecture13 control statementswitch.pptLecture13 control statementswitch.ppt
Lecture13 control statementswitch.ppt
 
Lecturer23 pointersin c.ppt
Lecturer23 pointersin c.pptLecturer23 pointersin c.ppt
Lecturer23 pointersin c.ppt
 
Lecture19 unionsin c.ppt
Lecture19 unionsin c.pptLecture19 unionsin c.ppt
Lecture19 unionsin c.ppt
 
Program development cyle
Program development cyleProgram development cyle
Program development cyle
 
Language processors
Language processorsLanguage processors
Language processors
 

Recently uploaded

Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?Mattias Andersson
 
CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):comworks
 
Search Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfSearch Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfRankYa
 
"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr Bagan"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr BaganFwdays
 
Human Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsHuman Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsMark Billinghurst
 
Unraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdfUnraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdfAlex Barbosa Coqueiro
 
Scanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsScanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsRizwan Syed
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii SoldatenkoFwdays
 
Artificial intelligence in cctv survelliance.pptx
Artificial intelligence in cctv survelliance.pptxArtificial intelligence in cctv survelliance.pptx
Artificial intelligence in cctv survelliance.pptxhariprasad279825
 
Connect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck PresentationConnect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck PresentationSlibray Presentation
 
TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024Lonnie McRorey
 
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
SAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptxSAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptxNavinnSomaal
 
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptxMerck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptxLoriGlavin3
 
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdfHyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdfPrecisely
 
DevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache MavenDevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache MavenHervé Boutemy
 
Developer Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLDeveloper Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLScyllaDB
 
DSPy a system for AI to Write Prompts and Do Fine Tuning
DSPy a system for AI to Write Prompts and Do Fine TuningDSPy a system for AI to Write Prompts and Do Fine Tuning
DSPy a system for AI to Write Prompts and Do Fine TuningLars Bell
 

Recently uploaded (20)

Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?
 
CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):
 
Search Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfSearch Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdf
 
"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr Bagan"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr Bagan
 
Human Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsHuman Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR Systems
 
Unraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdfUnraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdf
 
Scanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsScanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL Certs
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko
 
Artificial intelligence in cctv survelliance.pptx
Artificial intelligence in cctv survelliance.pptxArtificial intelligence in cctv survelliance.pptx
Artificial intelligence in cctv survelliance.pptx
 
Connect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck PresentationConnect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck Presentation
 
TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024
 
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
SAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptxSAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptx
 
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptxMerck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptx
 
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdfHyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
 
DevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache MavenDevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache Maven
 
Developer Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLDeveloper Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQL
 
DSPy a system for AI to Write Prompts and Do Fine Tuning
DSPy a system for AI to Write Prompts and Do Fine TuningDSPy a system for AI to Write Prompts and Do Fine Tuning
DSPy a system for AI to Write Prompts and Do Fine Tuning
 
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptxE-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
 

Introduction to html

  • 2. Introduction to HTML • HTML stands for Hyper Text Markup Language • Language interpreted by a web browser • Web-pages are also called HTML Documents. • It defines the structure and layout of a Web document by using a variety of tags and attributes. www.eshikshak.co.in
  • 3. Features of HTML • Create a Web page using tags. • Use graphics and display text in different fonts, sizes, and color. • Enhance the presentation of the document using HTML elements. • Create hyperlinks to navigate to different documents present on the Web. • Display data in a tabular format. • Create multiple windows in a Web page to display information from multiple sources in different windows www.eshikshak.co.in
  • 4. HTML tags • A command inserted in a document that specifies how the document, or a portion of the document, should be formatted. • HTML tags begin with an open angle bracket (<) and end with a close angle bracket (>). • HTML tags are of two types – Paired Tags – Singular Tags www.eshikshak.co.in
  • 5. HTML attributes • A language construct that programmers use to add additional information (i.e., metadata) to code elements (e.g., assemblies, modules, members, types, return values, and parameters) to extend their functionality. • Attributes are written immediately following the tag • Multiple attributes can be associated www.eshikshak.co.in
  • 6. Types of HTML tag – Paired tag • A tag is said to be a paired tag if the text is placed between a tag and its companion tag. • In paired tags, the first tag is referred to as Opening Tag and the second tag is referred to as Closing Tag. – Example: <i>This text is in italics. </i> – Note: Here, • <i> is called opening tag • </i> is called closing tag. www.eshikshak.co.in
  • 7. Types of HTML tag – Singular tag • A standalone tag does not have a companinon tag. – Example: <BR /> - This tag will insert a line break – This tag does not require any companion tag. www.eshikshak.co.in
  • 8. The structure of HTML document <html> This page is written in HTML <head> Head tag contians information <title> about web page Title of the web page title tag contains </title> title of a web page </head> body tag contains contents of <body> web page Content of the Page <address> Your address </address> This is the footer of the web page </body> </html> www.eshikshak.co.in
  • 9. The structure of HTML document • The basic structure for all HTML documents is simple and should include the following minimum elements or tags: – <html> : The main container for HTML pages – <head> : The container for page header information – <title> : The title of the page – <body> : The main body of the page www.eshikshak.co.in
  • 10. DOCTYPE • The HTML !doctype tag is used for specifying which version of HTML the document is using. This is referred to as the document type declaration (DTD). • <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN“ "http://www.w3. org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> www.eshikshak.co.in
  • 11. The <html> Element • The <html> element is the containing element for the whole HTML document. Each HTML document should have one <html> and each document should end with a closing </html> tag. • Following two elements appear as direct children of an <html> element: – <head> – <body> www.eshikshak.co.in
  • 12. The <head> Element • The <head> element is just a container for all other header elements. • It should be the first thing to appear after the opening <html> tag. • Each <head> element should contain a <title> element indicating the title of the document www.eshikshak.co.in
  • 13. The <head> Element • The <title> tag is used to give title to the document. • The <link> tag is used to link to an external file, such as a style sheet or JavaScript file. • The <style> tag is used to include CSS rules inside the document. • The <script> tag is used to include JAVAScript or VBScript inside the document. www.eshikshak.co.in
  • 14. The <head> Element • The <base> tag is used to create a "base" url for all links on the page. • The <object> tag is designed to include images, JavaScript objects, Flash animations, MP3 files, QuickTime movies and other components of a page. www.eshikshak.co.in
  • 15. The <title> Element: • To specify a title for every page that you write inside the <title> element. • This element is a child of the <head> element. • It is used in several ways: – It displays at the very top of a browser window. – It is used as the default name for a bookmark in browsers such as IE and Netscape. – Its is used by search engines that use its content to help index pages. www.eshikshak.co.in
  • 16. The <title> Element: • Here is the example of using title tag. <html> <head> <title>Welcome to MyWebsite</title> </head> </html> www.eshikshak.co.in
  • 17. The <body> Element: • The <body> element appears after the <head> element. • It contains the part of the Web page that you actually see in the main browser window. • A <body> element may contain anything from a couple of paragraphs under a heading to more complicated layouts containing forms and tables. www.eshikshak.co.in
  • 18. The <body> Element: • Here is the example of using body tag. <html> <head> <title>Welcome to MyWebsite</title> </head> <body> You are welcome to MyWebsite. </body> </html> www.eshikshak.co.in