Introduction to html


Published on

Introduction to html - Hyper Text Markup Language

Published in: Technology
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Introduction to html

  1. 1.
  2. 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.
  3. 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
  4. 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
  5. 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
  6. 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.
  7. 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.
  8. 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>
  9. 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
  10. 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>
  11. 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>
  12. 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
  13. 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.
  14. 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.
  15. 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.
  16. 16. The <title> Element:• Here is the example of using title tag. <html> <head> <title>Welcome to MyWebsite</title> </head> </html>
  17. 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.
  18. 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>