HTML

672 views

Published on

HTML tutorial (Basics)
language: English

Published in: Education
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
672
On SlideShare
0
From Embeds
0
Number of Embeds
29
Actions
Shares
0
Downloads
88
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

HTML

  1. 1. Web Design HTML Web Design Course Engsaad_aly@hotmail.com
  2. 2. Agenda What is HTML.HTML Simple Example. !DOCTYPE. title. h tag. p tag. Lists. Attributes. Links. Images. Lines. Comments. Text format. Tables.
  3. 3. HTML Hyper Text Markup Language Markup Language Set of markup tags TagsKeywords surrounded by angle brackets Normally come in pairs Start Tag End Tag Opening Tags Closing Tags <> </>
  4. 4. HTML Basic Structure<!DOCTYPE html> <html> <head> <title></title> <head> <body> </body> </html>
  5. 5. The <!DOCTYPE> Declaration
  6. 6. Page Titles
  7. 7. HTML Headings <h1>………..<h6>
  8. 8. HTML Headings
  9. 9. HTML Paragraphs
  10. 10. Dont Forget the End Tag
  11. 11. Lists<ul> <ol> <li> </li> <li> </li> <li> </li> <li> </li> <li> </li> <li> </li></ul> </ol>
  12. 12. Lists
  13. 13. ListsOrdered Lists
  14. 14. Lists
  15. 15. HTML Attributes
  16. 16. HTML Links An anchor tag <a> is used to define a link, but you also need to add the destination of the link.  The destination of the link is defined in the href attribute of the tag. The link can be absolute, such as:"http://www.google.com", or it can be relative to the current page.
  17. 17. HTML Links
  18. 18. Mailto link To create a link on your Web site that opens an email window .  <a href="mailto:e-mail">Send </a> Send email to more than one address  <a href="mailto:e-mail1, e-mail2">Send </a>
  19. 19. HTML Images img Tag
  20. 20. HTML Images Alternate Text < img src="facebook.jpg" alt= "facebook image" > Image source Alternate textThe alt attribute provides alternative information for an image if a user for some reason cannot view it .
  21. 21. HTML Images Width & Height < img src="facebook.jpg" alt= "facebook image" width="300" height=“500">If the image cannot be displayed, the value of the alt attribute will be displayed
  22. 22. HTML Lines
  23. 23. HTML Comments <!-- -->
  24. 24. HTML Text Formatting <b> …………………</b>
  25. 25. HTML Text Formatting <em> …………………</em>
  26. 26. HTML Text Formatting
  27. 27. HTML Tables
  28. 28. HTML TablesTable Table row Table Data 100 <tr> </tr><table> 200</table> <tr> 100 </tr>
  29. 29. HTML TablesTable Table row Table Data row 1, cell 1 <tr> </tr> row 1, cell 2<table ></table> row 2, cell 1 <tr> </tr> row 2, cell 2
  30. 30. HTML Tables Table Table row Table Data row 1, cell 1 <tr> </tr> row 1, cell 2<table border=“ ”> </table> row 2, cell 1 <tr> </tr> row 2, cell 2
  31. 31. HTML Tables Table Table row Table Data row 1, cell 1 <tr> </tr> row 1, cell 2<table border=“ ”> </table> row 2, cell 1 <tr> </tr> row 2, cell 2
  32. 32. HTML Tables
  33. 33. HTML Tables
  34. 34. HTML Tables
  35. 35. End of HTML Coding Part 1
  36. 36. Forms used to send data across the web and are often used as contact forms to convert information inputted by a user into an email.
  37. 37. knowVisual Illusion
  38. 38. knowVisual Illusion

×