Hyper Text Markup Language

2,768 views

Published on

Learn HTML - Its so easy..

Published in: Education, Technology
1 Comment
3 Likes
Statistics
Notes
No Downloads
Views
Total views
2,768
On SlideShare
0
From Embeds
0
Number of Embeds
80
Actions
Shares
0
Downloads
0
Comments
1
Likes
3
Embeds 0
No embeds

No notes for slide

Hyper Text Markup Language

  1. 1. WELCOME TOTHE WORLD OF <br />HTML<br />
  2. 2. HYPERTEXT MARKUP LANGUAGE<br />It is the encoding scheme used to create and format a web document<br />Hypertext - text with hyperlinks<br />Markup - syntactical and ordinary text<br />
  3. 3. Basic Information<br />
  4. 4. HTML Elements<br />There are 2 sections of a web document :<br /><ul><li>Heading Section</li></ul> - Title tag<br /> - Meta tag<br /> - Style tag<br /><ul><li>Body Section</li></ul> - Body tag<br /> - Heading tag<br /> - Other format tags<br /> - Advanced HTML tags<br />
  5. 5. SAMPLE HTML PROGRAM<br /><html><br /><head><br /><title><br />A Sample Program<br /></title><br /></head><br /><body><br />This is the first HTML program displayed in III computer science <br /></body><br /></html><br />
  6. 6.
  7. 7. TITLE TAG<br /><html><br /><head><br /><title><br />Our first web document <br /></title><br /></head><br /></html><br />
  8. 8. META TAG<br />Additional information invisible in the browser<br /><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><br /><HTML><br /><HEAD><br /><META content="text/html; charset=windows-1252" http-equiv=Content-Type> <br /><META name=Author content=III-C.S.><br /><META name=keywords content=definition><br /><META name=GENERATOR content="MSHTML 8.00.6001.18828"><br /></HEAD><br /><BODY>HTML is the abbreviated form of Hypertext Markup Language<br /></BODY><br /></HTML><br />
  9. 9. STYLE TAG<br /><html><br /><head><br /><title> style tag </title><br /><style><br />h3 { color : green;<br /> font-size : 18pt;<br /> font-family: Times New Roman;<br /> }<br /></style><br /></head><br /><body><br /><h3>HTML is the abbreviated form of HyperText Markup Language</h3><br /></body><br /></html><br />
  10. 10.
  11. 11. BODY TAG<br /><html><br /><head><br /><title> body tag </title><br /></head><br /><body bgcolor = red text = #FFFFFF><br />HTML is the abbreviated form of HyperText Markup Language<br /></body><br /></html><br />
  12. 12.
  13. 13. HEADING TAGS<br /><html><br /><head><br /><title> Heading tags </title><br /></head><br /><body bgcolor = green text = #FFFFFF><br /><h6>Computer</h6><br><br /><h5>Computer</h5><br><br /><h4>Computer</h4><br><br /><h3>Computer</h3><br><br /><h2>Computer</h2><br><br /><h1>Computer</h1><br><br /></body><br /></html><br />
  14. 14.
  15. 15. OTHER HTML TAGS<br />Syntax:<br /><tagname attribute=value>Element content </tagname><br />Paragraph tag <p> … </p><br />Break tag <br><br />Bold tag <b> … </b><br />Italic tag <i> … </i><br />Underline tag <u> … </u><br />Font tag (face, size, color) <font> … </font><br />Image tag <img><br />Anchor tag <a> … </a><br />
  16. 16. <html><br /><head><br /><title> Tags </title><br /></head><br /><body text = green><br /><p align = center> College Emblem </p><br /><center> <img src= emblem.jpeg width=100 height=100> </center> <br /><br><br /><font face="Arial" size=6pt color=red><br /><b> Computer Science Department </b><br /><p><br /><i>III year Computer Science</i><br /></p><br /><u>Teaching of Computer Science</u><br /></font><br /></body><br /></html><br />
  17. 17.
  18. 18. Anchor Tag<br /><html><br /><head><br /><title> Anchor Tag </title><br /></head><br /><body><br /><a href = "http://www.popejohnpaulcollege.org"> Our College Website </a><br /></body><br /></html><br />
  19. 19.
  20. 20. Advanced HTML Tags <br />Unordered lists <ul> … </ul><br />Ordered lists <ol> … </ol><br />Definition lists <dl> <dt> .. </dt><br /> <dd> .. </dd> </dl><br />Table tag <table> <tr> <th> .. </th> </tr><br /> <tr> <td> .. </td> </tr> </table> <br />Form tag <form> .. </form><br />Frame tag <frameset> .. </frameset> <br />
  21. 21. <html><br /><head><title> Lists </title></head><br /><body><br /><ul><br /><li>Name<br /><li>Course<br /></ul><br><br /><ol><br /><li>Name<br /><li>Course<br /></ol><br><br /><dl><br /><dt> HTML: </dt><br /><dd> It is the encoding scheme used to create and format a web document </dd><br /></dl><br /></body><br /></html><br />
  22. 22.
  23. 23. <html><br /><head><br /><title> Table </title><br /></head><br /><body><br /><table border=2 cellspacing=10 cellpadding=10><br /><tr><br /><th> Roll No </th><br /><th> Name </th><br /></tr><br /><tr><br /><td> 1001 </td><br /><td> XXX </td><br /></tr><br /></body><br /></html><br />
  24. 24.
  25. 25. Form Tag<br />Receive information from user<br /><html><br /><head><br /><title> Form </title><br /></head><br /><body><br /><form method = post action = "Server side program name" ><br /><input type = text name = empname value = XXX><br /><input type = text name = age value = 24><br /><input type = submit><br /></form><br /></body><br /></html><br />
  26. 26.
  27. 27. Frame Tag<br />Divide web page into sections<br /><html><br /><head><br /><title> Frameset </title><br /></head><br /><frameset rows= "64,*" ><br /><frame src = "Top.html" name = "banner" scrolling="no" noresize><br /><frameset cols = "150,*" ><br /><frame src = "menu.html" name = "contents"><br /><frame src = "home.html" name = "main"><br /></frameset><br /></frameset><br /></html><br />
  28. 28.
  29. 29.
  30. 30. USES AND DELIVERY OF HTML<br /> Web pages creation<br />It is delivered by HTTP from a Web Browser<br />E-mail<br />WWW makes use of HTML documents<br /> (Web Server to Web Browser using HTTP)<br />
  31. 31. ANY QUERIES ?<br />
  32. 32. REFERENCES<br />Introduction to Web Design <br /> by E.Balagurusamy<br />http://en.wikipedia.org/HTML<br />
  33. 33. THANK YOU<br />

×