SlideShare a Scribd company logo
Introduction


Haider M. Habeeb
   The Internet
   The World Wide Web
   The Web Browser
       The Ef fect of Browser Wars
   Dynamic HTML
   HTML Basics
   Internet:
       network of computers that are connected to each
        other and are able to transmit and receive data
   World Wide Web:
       It’s made up of millions of files and documents
        residing on different computers across the Internet
       Many different devices can access the web:
        desktop and laptop computers, personal digital
        assistants (PDAs), mobile phones
   Web Browser
       a program intended to visually render web
        documents.
       whereas some user-agents interpret HTML but
        don’t display it.
       known as a client, because it is the thing requesting
        and receiving service.
   Browser Wars
       Browser s incompatibility.
       Problems  browser manufacturers created their
        own non-standardized.
       Web pages look fine on one browser, but not with
        other browsers.
       W3C standards  Internet Explorer 5 and 6,
        Netscape 6 and 7, and Firefox. DHTML has become
        a much more powerful tool and a standard.
   DHTML is:
       stands for Dynamic HyperText Markup Language.
       NOT a Language
       NOT a language or a web standard.
       a combination of HTML, JavaScript, DOM and CSS.
   “Dynamic HTML is a term used by some
    vendors to describe the combination of HTML,
    style sheets and scripts that allows documents
    to be animated.”
                        World Wide Web Consortium (W3C)
   What we are going to study?
       HTML - Hyper Text Markup Language.
       CSS - Cascading Style Sheets.
       JavaScript - scripting language on the internet.
       DOM – Documents Object Model.
   Static vs. Dynamic HTML
   Static HTML:
       HTML elements (paragraphs, images, etc.) in a
        specific order in the source code.
       The browser always showed all elements in this
        order.
       Positioning and styling was done by tables.
       For any changing, we had to rewrite the HTML.
   Dynamic HTML:
       re-organize our pages on the fly: we can take some
        elements out of the natural flow of the page, put
        them somewhere else and change its position
        again.
       It calculates the tables and paragraphs and other
        things, then displays them in the best possible way,
        one by one, from the beginning to the end of the
        HTML document.
   What is HTML?
       HTML is a language for describing web pages.

   HTML stands for Hyper Text Markup Language
   HTML is not a programming language, it is a
    markup language
   A markup language is a set of markup tags
   HTML uses markup tags to describe web
    pages
   HTML Tags
       HTML markup tags are usually called HTML tags

   HTML tags are keywords surrounded by angle brackets like
    <html>
   HTML tags normally come in pairs like <b> and </b>
   The first tag in a pair is the star t tag, the second tag is the
    end tag
   Start and end tags are also called opening tags and closing
    tags
   HTML Documents
       HTML documents describe web pages
       HTML documents contain HTML tags and plain text
       HTML documents are also called web pages
   The purpose of a web browser (Internet
    Explorer or Firefox) is to read HTML documents
    and display them as web pages.
   The browser does not display the HTML tags, but
    uses the tags to interpret the content of the page.
   What do you need?
       Notepad for editing your HTML documents.
       Browser for displaying your web pages


                       Ready?
   .HTM or .HTML File Extension?
       When you save an HTML file, you can use either the
        .htm or the .html file extension.
       With new software it is perfectly safe to use .html.
Simplified Structure of HTML:
<html>
   <head>
     <title> . . . . . . . . . . . .</title>
   </head>
   <body>
   …….
   ……..
   </body>
</html>
   HTML Headings
       HTML headings are defined with the <h1> to <h6> tags.
Example:
<html>
<head>
</head>
<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
</body>
</html>
   HTML Paragraphs
       HTML paragraphs are defined with the <p> tag.

   Example
    <p>This is a paragraph.</p>
    <p>This is another paragraph.</p>
   HTML Formatting Tags
       HTML uses tags like <b> and <i> for formatting output, like bold or italic text.
       These HTML tags are called formatting tags.
   Example:
    <html>
    <body>
     <p><b>This text is bold</b></p>
    <p><strong>This text is strong</strong></p>
    <p><big>This text is big</big></p>
    <p><i>This text is italic</i></p>
    <p><small>This text is small</small></p>
    <p>This is<sub> subscript</sub> and <sup>superscript</sup></p>
     </body>
    </html>
Dynamic  html (#1)

More Related Content

What's hot

Dynamic HTML (DHTML)
Dynamic HTML (DHTML)Dynamic HTML (DHTML)
Dynamic HTML (DHTML)
Himanshu Kumar
 
basic introduction of html tags
basic introduction  of html tagsbasic introduction  of html tags
basic introduction of html tags
Manish jariyal
 
3. Web Technology Advanced HTML
3. Web Technology Advanced HTML3. Web Technology Advanced HTML
3. Web Technology Advanced HTML
Jyoti Yadav
 
Introduction to basic HTML [Librarian edition]
Introduction to basic HTML [Librarian edition]Introduction to basic HTML [Librarian edition]
Introduction to basic HTML [Librarian edition]
Kosie Eloff
 
Web Design L1 - Untagling the Web
Web Design L1 - Untagling the WebWeb Design L1 - Untagling the Web
Web Design L1 - Untagling the Web
mykella
 
Html
HtmlHtml
Web designing using html
Web designing using htmlWeb designing using html
Web designing using html
julicris021488
 
Ict html
Ict htmlIct html
Ict html
Thando Mdluli
 
HTML Introduction
HTML IntroductionHTML Introduction
HTML Introductionc525600
 
HTML- Hyper Text Markup Language
HTML- Hyper Text Markup LanguageHTML- Hyper Text Markup Language
HTML- Hyper Text Markup Language
Trinity Dwarka
 
[Basic HTML/CSS] 1. html - basic tags
[Basic HTML/CSS] 1. html - basic tags[Basic HTML/CSS] 1. html - basic tags
[Basic HTML/CSS] 1. html - basic tags
Hyejin Oh
 
3. tutorial html web desain
3. tutorial html web desain3. tutorial html web desain
3. tutorial html web desainfaizibra
 
Web Page Designing
Web Page DesigningWeb Page Designing
Web Page Designing
Amit Mali
 
The Difference between HTML, XHTML & HTML5 for Beginners
The Difference between HTML, XHTML & HTML5 for BeginnersThe Difference between HTML, XHTML & HTML5 for Beginners
The Difference between HTML, XHTML & HTML5 for Beginners
Rasin Bekkevold
 
HTML Basic, CSS Basic, JavaScript basic.
HTML Basic, CSS Basic, JavaScript basic.HTML Basic, CSS Basic, JavaScript basic.
HTML Basic, CSS Basic, JavaScript basic.
Beqa Chacha
 

What's hot (19)

Dynamic HTML (DHTML)
Dynamic HTML (DHTML)Dynamic HTML (DHTML)
Dynamic HTML (DHTML)
 
basic introduction of html tags
basic introduction  of html tagsbasic introduction  of html tags
basic introduction of html tags
 
3. Web Technology Advanced HTML
3. Web Technology Advanced HTML3. Web Technology Advanced HTML
3. Web Technology Advanced HTML
 
Introduction to basic HTML [Librarian edition]
Introduction to basic HTML [Librarian edition]Introduction to basic HTML [Librarian edition]
Introduction to basic HTML [Librarian edition]
 
Introduction to XHTML
Introduction to XHTMLIntroduction to XHTML
Introduction to XHTML
 
Web Design L1 - Untagling the Web
Web Design L1 - Untagling the WebWeb Design L1 - Untagling the Web
Web Design L1 - Untagling the Web
 
Basic HTML
Basic HTMLBasic HTML
Basic HTML
 
Html
HtmlHtml
Html
 
Web designing using html
Web designing using htmlWeb designing using html
Web designing using html
 
Html
HtmlHtml
Html
 
Ict html
Ict htmlIct html
Ict html
 
HTML Introduction
HTML IntroductionHTML Introduction
HTML Introduction
 
HTML- Hyper Text Markup Language
HTML- Hyper Text Markup LanguageHTML- Hyper Text Markup Language
HTML- Hyper Text Markup Language
 
[Basic HTML/CSS] 1. html - basic tags
[Basic HTML/CSS] 1. html - basic tags[Basic HTML/CSS] 1. html - basic tags
[Basic HTML/CSS] 1. html - basic tags
 
Intro to HTML
Intro to HTMLIntro to HTML
Intro to HTML
 
3. tutorial html web desain
3. tutorial html web desain3. tutorial html web desain
3. tutorial html web desain
 
Web Page Designing
Web Page DesigningWeb Page Designing
Web Page Designing
 
The Difference between HTML, XHTML & HTML5 for Beginners
The Difference between HTML, XHTML & HTML5 for BeginnersThe Difference between HTML, XHTML & HTML5 for Beginners
The Difference between HTML, XHTML & HTML5 for Beginners
 
HTML Basic, CSS Basic, JavaScript basic.
HTML Basic, CSS Basic, JavaScript basic.HTML Basic, CSS Basic, JavaScript basic.
HTML Basic, CSS Basic, JavaScript basic.
 

Viewers also liked

Servlet basics
Servlet basicsServlet basics
Servlet basics
Santosh Dhoundiyal
 
M-Brokrage
M-BrokrageM-Brokrage
M-Brokrage
Bahaa Farouk
 
Core web application development
Core web application developmentCore web application development
Core web application developmentBahaa Farouk
 
Servlets
ServletsServlets
Java Servlets
Java ServletsJava Servlets
Java ServletsNitin Pai
 
Java servlet life cycle - methods ppt
Java servlet life cycle - methods pptJava servlet life cycle - methods ppt
Java servlet life cycle - methods ppt
kamal kotecha
 

Viewers also liked (6)

Servlet basics
Servlet basicsServlet basics
Servlet basics
 
M-Brokrage
M-BrokrageM-Brokrage
M-Brokrage
 
Core web application development
Core web application developmentCore web application development
Core web application development
 
Servlets
ServletsServlets
Servlets
 
Java Servlets
Java ServletsJava Servlets
Java Servlets
 
Java servlet life cycle - methods ppt
Java servlet life cycle - methods pptJava servlet life cycle - methods ppt
Java servlet life cycle - methods ppt
 

Similar to Dynamic html (#1)

Grade 7_HTML.pptx
Grade 7_HTML.pptxGrade 7_HTML.pptx
Grade 7_HTML.pptx
shilpak0307
 
Grade 10 COMPUTER
Grade 10 COMPUTERGrade 10 COMPUTER
Grade 10 COMPUTER
Joel Linquico
 
Internet programming notes
Internet programming notesInternet programming notes
Internet programming notes
Durgadevi palani
 
Html-meeting1-1.pptx
Html-meeting1-1.pptxHtml-meeting1-1.pptx
Html-meeting1-1.pptx
YoussefAbobakr
 
Web engineering notes unit 3
Web engineering notes unit 3Web engineering notes unit 3
Web engineering notes unit 3
inshu1890
 
Web Engineering UNIT III as per RGPV Syllabus
Web Engineering UNIT III as per RGPV SyllabusWeb Engineering UNIT III as per RGPV Syllabus
Web Engineering UNIT III as per RGPV Syllabus
NANDINI SHARMA
 
Html Concept
Html ConceptHtml Concept
Html Concept
Jaya Kumari
 
Tutorial 08 - Creating Effective Web Pages
Tutorial 08 - Creating Effective Web PagesTutorial 08 - Creating Effective Web Pages
Tutorial 08 - Creating Effective Web Pagesguest22edf3
 
Tutorial 08 - Creating Effective Web Pages
Tutorial 08 - Creating Effective Web PagesTutorial 08 - Creating Effective Web Pages
Tutorial 08 - Creating Effective Web Pagesdpd
 
Markup language classification, designing static and dynamic
Markup language classification, designing static and dynamicMarkup language classification, designing static and dynamic
Markup language classification, designing static and dynamicAnkita Bhalla
 
An Introduction to HTML
An Introduction to HTMLAn Introduction to HTML
An Introduction to HTMLcrea8ivemoiz
 
introdution-to-html (1).ppt
introdution-to-html (1).pptintrodution-to-html (1).ppt
introdution-to-html (1).ppt
Marktero2
 
introdution-to-html.pptx
introdution-to-html.pptxintrodution-to-html.pptx
introdution-to-html.pptx
datapro2
 
Lecture-1.pptx
Lecture-1.pptxLecture-1.pptx
Lecture-1.pptx
vishal choudhary
 
Html basics
Html basicsHtml basics
Html basics
Vjay Vijju
 
Importance of HTML
Importance of HTMLImportance of HTML
Vskills certified html designer Notes
Vskills certified html designer NotesVskills certified html designer Notes
Vskills certified html designer Notes
Vskills
 

Similar to Dynamic html (#1) (20)

Grade 7_HTML.pptx
Grade 7_HTML.pptxGrade 7_HTML.pptx
Grade 7_HTML.pptx
 
Iwt module 1
Iwt  module 1Iwt  module 1
Iwt module 1
 
Grade 10 COMPUTER
Grade 10 COMPUTERGrade 10 COMPUTER
Grade 10 COMPUTER
 
Internet programming notes
Internet programming notesInternet programming notes
Internet programming notes
 
Introduction to html
Introduction to htmlIntroduction to html
Introduction to html
 
Html-meeting1-1.pptx
Html-meeting1-1.pptxHtml-meeting1-1.pptx
Html-meeting1-1.pptx
 
Web engineering notes unit 3
Web engineering notes unit 3Web engineering notes unit 3
Web engineering notes unit 3
 
Web Engineering UNIT III as per RGPV Syllabus
Web Engineering UNIT III as per RGPV SyllabusWeb Engineering UNIT III as per RGPV Syllabus
Web Engineering UNIT III as per RGPV Syllabus
 
Html Concept
Html ConceptHtml Concept
Html Concept
 
Tutorial 08 - Creating Effective Web Pages
Tutorial 08 - Creating Effective Web PagesTutorial 08 - Creating Effective Web Pages
Tutorial 08 - Creating Effective Web Pages
 
Tutorial 08 - Creating Effective Web Pages
Tutorial 08 - Creating Effective Web PagesTutorial 08 - Creating Effective Web Pages
Tutorial 08 - Creating Effective Web Pages
 
Markup language classification, designing static and dynamic
Markup language classification, designing static and dynamicMarkup language classification, designing static and dynamic
Markup language classification, designing static and dynamic
 
An Introduction to HTML
An Introduction to HTMLAn Introduction to HTML
An Introduction to HTML
 
introdution-to-html (1).ppt
introdution-to-html (1).pptintrodution-to-html (1).ppt
introdution-to-html (1).ppt
 
introdution-to-html.pptx
introdution-to-html.pptxintrodution-to-html.pptx
introdution-to-html.pptx
 
Lecture-1.pptx
Lecture-1.pptxLecture-1.pptx
Lecture-1.pptx
 
Html basics
Html basicsHtml basics
Html basics
 
Web Designing
Web DesigningWeb Designing
Web Designing
 
Importance of HTML
Importance of HTMLImportance of HTML
Importance of HTML
 
Vskills certified html designer Notes
Vskills certified html designer NotesVskills certified html designer Notes
Vskills certified html designer Notes
 

Recently uploaded

June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...
June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...
June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...
Levi Shapiro
 
The Challenger.pdf DNHS Official Publication
The Challenger.pdf DNHS Official PublicationThe Challenger.pdf DNHS Official Publication
The Challenger.pdf DNHS Official Publication
Delapenabediema
 
Operation Blue Star - Saka Neela Tara
Operation Blue Star   -  Saka Neela TaraOperation Blue Star   -  Saka Neela Tara
Operation Blue Star - Saka Neela Tara
Balvir Singh
 
The Roman Empire A Historical Colossus.pdf
The Roman Empire A Historical Colossus.pdfThe Roman Empire A Historical Colossus.pdf
The Roman Empire A Historical Colossus.pdf
kaushalkr1407
 
Model Attribute Check Company Auto Property
Model Attribute  Check Company Auto PropertyModel Attribute  Check Company Auto Property
Model Attribute Check Company Auto Property
Celine George
 
Acetabularia Information For Class 9 .docx
Acetabularia Information For Class 9  .docxAcetabularia Information For Class 9  .docx
Acetabularia Information For Class 9 .docx
vaibhavrinwa19
 
678020731-Sumas-y-Restas-Para-Colorear.pdf
678020731-Sumas-y-Restas-Para-Colorear.pdf678020731-Sumas-y-Restas-Para-Colorear.pdf
678020731-Sumas-y-Restas-Para-Colorear.pdf
CarlosHernanMontoyab2
 
Phrasal Verbs.XXXXXXXXXXXXXXXXXXXXXXXXXX
Phrasal Verbs.XXXXXXXXXXXXXXXXXXXXXXXXXXPhrasal Verbs.XXXXXXXXXXXXXXXXXXXXXXXXXX
Phrasal Verbs.XXXXXXXXXXXXXXXXXXXXXXXXXX
MIRIAMSALINAS13
 
Thesis Statement for students diagnonsed withADHD.ppt
Thesis Statement for students diagnonsed withADHD.pptThesis Statement for students diagnonsed withADHD.ppt
Thesis Statement for students diagnonsed withADHD.ppt
EverAndrsGuerraGuerr
 
Adversarial Attention Modeling for Multi-dimensional Emotion Regression.pdf
Adversarial Attention Modeling for Multi-dimensional Emotion Regression.pdfAdversarial Attention Modeling for Multi-dimensional Emotion Regression.pdf
Adversarial Attention Modeling for Multi-dimensional Emotion Regression.pdf
Po-Chuan Chen
 
A Strategic Approach: GenAI in Education
A Strategic Approach: GenAI in EducationA Strategic Approach: GenAI in Education
A Strategic Approach: GenAI in Education
Peter Windle
 
Additional Benefits for Employee Website.pdf
Additional Benefits for Employee Website.pdfAdditional Benefits for Employee Website.pdf
Additional Benefits for Employee Website.pdf
joachimlavalley1
 
Honest Reviews of Tim Han LMA Course Program.pptx
Honest Reviews of Tim Han LMA Course Program.pptxHonest Reviews of Tim Han LMA Course Program.pptx
Honest Reviews of Tim Han LMA Course Program.pptx
timhan337
 
The Accursed House by Émile Gaboriau.pptx
The Accursed House by Émile Gaboriau.pptxThe Accursed House by Émile Gaboriau.pptx
The Accursed House by Émile Gaboriau.pptx
DhatriParmar
 
special B.ed 2nd year old paper_20240531.pdf
special B.ed 2nd year old paper_20240531.pdfspecial B.ed 2nd year old paper_20240531.pdf
special B.ed 2nd year old paper_20240531.pdf
Special education needs
 
How to Make a Field invisible in Odoo 17
How to Make a Field invisible in Odoo 17How to Make a Field invisible in Odoo 17
How to Make a Field invisible in Odoo 17
Celine George
 
Supporting (UKRI) OA monographs at Salford.pptx
Supporting (UKRI) OA monographs at Salford.pptxSupporting (UKRI) OA monographs at Salford.pptx
Supporting (UKRI) OA monographs at Salford.pptx
Jisc
 
Digital Tools and AI for Teaching Learning and Research
Digital Tools and AI for Teaching Learning and ResearchDigital Tools and AI for Teaching Learning and Research
Digital Tools and AI for Teaching Learning and Research
Vikramjit Singh
 
CACJapan - GROUP Presentation 1- Wk 4.pdf
CACJapan - GROUP Presentation 1- Wk 4.pdfCACJapan - GROUP Presentation 1- Wk 4.pdf
CACJapan - GROUP Presentation 1- Wk 4.pdf
camakaiclarkmusic
 
Home assignment II on Spectroscopy 2024 Answers.pdf
Home assignment II on Spectroscopy 2024 Answers.pdfHome assignment II on Spectroscopy 2024 Answers.pdf
Home assignment II on Spectroscopy 2024 Answers.pdf
Tamralipta Mahavidyalaya
 

Recently uploaded (20)

June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...
June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...
June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...
 
The Challenger.pdf DNHS Official Publication
The Challenger.pdf DNHS Official PublicationThe Challenger.pdf DNHS Official Publication
The Challenger.pdf DNHS Official Publication
 
Operation Blue Star - Saka Neela Tara
Operation Blue Star   -  Saka Neela TaraOperation Blue Star   -  Saka Neela Tara
Operation Blue Star - Saka Neela Tara
 
The Roman Empire A Historical Colossus.pdf
The Roman Empire A Historical Colossus.pdfThe Roman Empire A Historical Colossus.pdf
The Roman Empire A Historical Colossus.pdf
 
Model Attribute Check Company Auto Property
Model Attribute  Check Company Auto PropertyModel Attribute  Check Company Auto Property
Model Attribute Check Company Auto Property
 
Acetabularia Information For Class 9 .docx
Acetabularia Information For Class 9  .docxAcetabularia Information For Class 9  .docx
Acetabularia Information For Class 9 .docx
 
678020731-Sumas-y-Restas-Para-Colorear.pdf
678020731-Sumas-y-Restas-Para-Colorear.pdf678020731-Sumas-y-Restas-Para-Colorear.pdf
678020731-Sumas-y-Restas-Para-Colorear.pdf
 
Phrasal Verbs.XXXXXXXXXXXXXXXXXXXXXXXXXX
Phrasal Verbs.XXXXXXXXXXXXXXXXXXXXXXXXXXPhrasal Verbs.XXXXXXXXXXXXXXXXXXXXXXXXXX
Phrasal Verbs.XXXXXXXXXXXXXXXXXXXXXXXXXX
 
Thesis Statement for students diagnonsed withADHD.ppt
Thesis Statement for students diagnonsed withADHD.pptThesis Statement for students diagnonsed withADHD.ppt
Thesis Statement for students diagnonsed withADHD.ppt
 
Adversarial Attention Modeling for Multi-dimensional Emotion Regression.pdf
Adversarial Attention Modeling for Multi-dimensional Emotion Regression.pdfAdversarial Attention Modeling for Multi-dimensional Emotion Regression.pdf
Adversarial Attention Modeling for Multi-dimensional Emotion Regression.pdf
 
A Strategic Approach: GenAI in Education
A Strategic Approach: GenAI in EducationA Strategic Approach: GenAI in Education
A Strategic Approach: GenAI in Education
 
Additional Benefits for Employee Website.pdf
Additional Benefits for Employee Website.pdfAdditional Benefits for Employee Website.pdf
Additional Benefits for Employee Website.pdf
 
Honest Reviews of Tim Han LMA Course Program.pptx
Honest Reviews of Tim Han LMA Course Program.pptxHonest Reviews of Tim Han LMA Course Program.pptx
Honest Reviews of Tim Han LMA Course Program.pptx
 
The Accursed House by Émile Gaboriau.pptx
The Accursed House by Émile Gaboriau.pptxThe Accursed House by Émile Gaboriau.pptx
The Accursed House by Émile Gaboriau.pptx
 
special B.ed 2nd year old paper_20240531.pdf
special B.ed 2nd year old paper_20240531.pdfspecial B.ed 2nd year old paper_20240531.pdf
special B.ed 2nd year old paper_20240531.pdf
 
How to Make a Field invisible in Odoo 17
How to Make a Field invisible in Odoo 17How to Make a Field invisible in Odoo 17
How to Make a Field invisible in Odoo 17
 
Supporting (UKRI) OA monographs at Salford.pptx
Supporting (UKRI) OA monographs at Salford.pptxSupporting (UKRI) OA monographs at Salford.pptx
Supporting (UKRI) OA monographs at Salford.pptx
 
Digital Tools and AI for Teaching Learning and Research
Digital Tools and AI for Teaching Learning and ResearchDigital Tools and AI for Teaching Learning and Research
Digital Tools and AI for Teaching Learning and Research
 
CACJapan - GROUP Presentation 1- Wk 4.pdf
CACJapan - GROUP Presentation 1- Wk 4.pdfCACJapan - GROUP Presentation 1- Wk 4.pdf
CACJapan - GROUP Presentation 1- Wk 4.pdf
 
Home assignment II on Spectroscopy 2024 Answers.pdf
Home assignment II on Spectroscopy 2024 Answers.pdfHome assignment II on Spectroscopy 2024 Answers.pdf
Home assignment II on Spectroscopy 2024 Answers.pdf
 

Dynamic html (#1)

  • 2. The Internet  The World Wide Web  The Web Browser  The Ef fect of Browser Wars  Dynamic HTML  HTML Basics
  • 3. Internet:  network of computers that are connected to each other and are able to transmit and receive data  World Wide Web:  It’s made up of millions of files and documents residing on different computers across the Internet  Many different devices can access the web: desktop and laptop computers, personal digital assistants (PDAs), mobile phones
  • 4. Web Browser  a program intended to visually render web documents.  whereas some user-agents interpret HTML but don’t display it.  known as a client, because it is the thing requesting and receiving service.
  • 5. Browser Wars  Browser s incompatibility.  Problems  browser manufacturers created their own non-standardized.  Web pages look fine on one browser, but not with other browsers.  W3C standards  Internet Explorer 5 and 6, Netscape 6 and 7, and Firefox. DHTML has become a much more powerful tool and a standard.
  • 6. DHTML is:  stands for Dynamic HyperText Markup Language.  NOT a Language  NOT a language or a web standard.  a combination of HTML, JavaScript, DOM and CSS.
  • 7. “Dynamic HTML is a term used by some vendors to describe the combination of HTML, style sheets and scripts that allows documents to be animated.” World Wide Web Consortium (W3C)
  • 8. What we are going to study?  HTML - Hyper Text Markup Language.  CSS - Cascading Style Sheets.  JavaScript - scripting language on the internet.  DOM – Documents Object Model.
  • 9. Static vs. Dynamic HTML  Static HTML:  HTML elements (paragraphs, images, etc.) in a specific order in the source code.  The browser always showed all elements in this order.  Positioning and styling was done by tables.  For any changing, we had to rewrite the HTML.
  • 10. Dynamic HTML:  re-organize our pages on the fly: we can take some elements out of the natural flow of the page, put them somewhere else and change its position again.  It calculates the tables and paragraphs and other things, then displays them in the best possible way, one by one, from the beginning to the end of the HTML document.
  • 11. What is HTML?  HTML is a language for describing web pages.  HTML stands for Hyper Text Markup Language  HTML is not a programming language, it is a markup language  A markup language is a set of markup tags  HTML uses markup tags to describe web pages
  • 12. HTML Tags  HTML markup tags are usually called HTML tags  HTML tags are keywords surrounded by angle brackets like <html>  HTML tags normally come in pairs like <b> and </b>  The first tag in a pair is the star t tag, the second tag is the end tag  Start and end tags are also called opening tags and closing tags
  • 13. HTML Documents  HTML documents describe web pages  HTML documents contain HTML tags and plain text  HTML documents are also called web pages  The purpose of a web browser (Internet Explorer or Firefox) is to read HTML documents and display them as web pages.  The browser does not display the HTML tags, but uses the tags to interpret the content of the page.
  • 14. What do you need?  Notepad for editing your HTML documents.  Browser for displaying your web pages Ready?
  • 15. .HTM or .HTML File Extension?  When you save an HTML file, you can use either the .htm or the .html file extension.  With new software it is perfectly safe to use .html.
  • 16. Simplified Structure of HTML: <html> <head> <title> . . . . . . . . . . . .</title> </head> <body> ……. …….. </body> </html>
  • 17. HTML Headings  HTML headings are defined with the <h1> to <h6> tags. Example: <html> <head> </head> <body> <h1>This is heading 1</h1> <h2>This is heading 2</h2> <h3>This is heading 3</h3> <h4>This is heading 4</h4> <h5>This is heading 5</h5> <h6>This is heading 6</h6> </body> </html>
  • 18. HTML Paragraphs  HTML paragraphs are defined with the <p> tag.  Example <p>This is a paragraph.</p> <p>This is another paragraph.</p>
  • 19. HTML Formatting Tags  HTML uses tags like <b> and <i> for formatting output, like bold or italic text.  These HTML tags are called formatting tags.  Example: <html> <body>  <p><b>This text is bold</b></p> <p><strong>This text is strong</strong></p> <p><big>This text is big</big></p> <p><i>This text is italic</i></p> <p><small>This text is small</small></p> <p>This is<sub> subscript</sub> and <sup>superscript</sup></p>  </body> </html>