Dynamic html (#1)
Download as PPT, PDF0 likes756 views
The document introduces various topics related to HTML and web development, including: - The Internet, World Wide Web, and web browsers. - Dynamic HTML (DHTML) which combines HTML, CSS, JavaScript and the DOM to allow dynamic web content. - An overview of HTML including basic tags for headings, paragraphs, and text formatting. - The difference between static and dynamic HTML, with dynamic HTML allowing reorganization of content.
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>