Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Introduction to HTML5: Part II

71 views

Published on

Second part of an introduction to HTML5 and related technologies

Published in: Education
  • Looking For A Job? Positions available now. FT or PT. $10-$30/hr. No exp required. ♣♣♣ http://ishbv.com/easywriter/pdf
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Be the first to like this

Introduction to HTML5: Part II

  1. 1. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Introduction to HTML5: Part II Apostolos Syropoulos Xanthi, Greece asyropoulos@yahoo.com Introduction to HTML5 for members of the Erasmus+ founded project GAMES
  2. 2. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Presentation Outline 1 HTML Lists 2 HTML Tables 3 Video and Audio 4 Various Elements 5 Finale
  3. 3. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML Lists: Part 1
  4. 4. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML Lists: Part 1 Three types of lists:
  5. 5. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML Lists: Part 1 Three types of lists: unordered,
  6. 6. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML Lists: Part 1 Three types of lists: unordered, ordered, and
  7. 7. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML Lists: Part 1 Three types of lists: unordered, ordered, and description lists.
  8. 8. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML Lists: Part 1 Three types of lists: unordered, ordered, and description lists. Unordered list
  9. 9. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML Lists: Part 1 Three types of lists: unordered, ordered, and description lists. Unordered list <ul style="list-style-type:disc"> <li> éclair</li> <li> croissant</li> <li> kouign amann</li> </ul>
  10. 10. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML Lists: Part 1 Three types of lists: unordered, ordered, and description lists. Unordered list <ul style="list-style-type:disc"> <li> éclair</li> <li> croissant</li> <li> kouign amann</li> </ul> Other styles include circle,
  11. 11. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML Lists: Part 1 Three types of lists: unordered, ordered, and description lists. Unordered list <ul style="list-style-type:disc"> <li> éclair</li> <li> croissant</li> <li> kouign amann</li> </ul> Other styles include circle, square, and
  12. 12. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML Lists: Part 1 Three types of lists: unordered, ordered, and description lists. Unordered list <ul style="list-style-type:disc"> <li> éclair</li> <li> croissant</li> <li> kouign amann</li> </ul> Other styles include circle, square, and none.
  13. 13. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML Lists: Part 2
  14. 14. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML Lists: Part 2 Ordered list
  15. 15. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML Lists: Part 2 Ordered list <ol type="1"> <li> Paris-Brest</li> <li> religieuse</li> <li> mille-feuille</li> </ol>
  16. 16. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML Lists: Part 2 Ordered list <ol type="1"> <li> Paris-Brest</li> <li> religieuse</li> <li> mille-feuille</li> </ol> the type attribute defines the type of the item marker:
  17. 17. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML Lists: Part 2 Ordered list <ol type="1"> <li> Paris-Brest</li> <li> religieuse</li> <li> mille-feuille</li> </ol> the type attribute defines the type of the item marker: type="1" for numbers (default, that is, you can ignore it!);
  18. 18. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML Lists: Part 2 Ordered list <ol type="1"> <li> Paris-Brest</li> <li> religieuse</li> <li> mille-feuille</li> </ol> the type attribute defines the type of the item marker: type="1" for numbers (default, that is, you can ignore it!); type="A" or type="a" for uppercase or lowercase letters, respectively;
  19. 19. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML Lists: Part 2 Ordered list <ol type="1"> <li> Paris-Brest</li> <li> religieuse</li> <li> mille-feuille</li> </ol> the type attribute defines the type of the item marker: type="1" for numbers (default, that is, you can ignore it!); type="A" or type="a" for uppercase or lowercase letters, respectively; type="I" or type="i" for uppercase or lowercase roman numerals, respectively.
  20. 20. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML Lists: Part 3
  21. 21. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML Lists: Part 3 Unordered list
  22. 22. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML Lists: Part 3 Unordered list <dl> <dt>Macarons</dt> <dd>A meringue-like cookie</dd> <dt>Opera cake</dt> <dd>An elegant gâteau</dd> </dl>
  23. 23. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML Lists: Part 3 Unordered list <dl> <dt>Macarons</dt> <dd>A meringue-like cookie</dd> <dt>Opera cake</dt> <dd>An elegant gâteau</dd> </dl>
  24. 24. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Let’s Practice
  25. 25. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Let’s Practice Create an HTML file with that will contain the following list:
  26. 26. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Let’s Practice Create an HTML file with that will contain the following list: <dl> <dt>Macarons</dt> <dd>A meringue-like cookie</dd> <dt>Opera cake</dt> <dd>An elegant gâteau</dd> <dt>Crème brûlée</dt> <dd>A delicious creme</dd> <dt>Poire belle Hélène</dt> <dd>A dessert made from pears</dd> <dt>Tarte Tatin</dt> <dd>Hotel Tatin signature dish</dd> </dl>
  27. 27. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Tables in General
  28. 28. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Tables in General Tables are used to display information in tabular form.
  29. 29. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Tables in General Tables are used to display information in tabular form. An HTML table is defined with the <table> tag.
  30. 30. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Tables in General Tables are used to display information in tabular form. An HTML table is defined with the <table> tag. Each table row is defined with the <tr> tag.
  31. 31. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Tables in General Tables are used to display information in tabular form. An HTML table is defined with the <table> tag. Each table row is defined with the <tr> tag. A table header is defined with the <th> tag.
  32. 32. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Tables in General Tables are used to display information in tabular form. An HTML table is defined with the <table> tag. Each table row is defined with the <tr> tag. A table header is defined with the <th> tag. By default, table headings are bold and centered.
  33. 33. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Tables in General Tables are used to display information in tabular form. An HTML table is defined with the <table> tag. Each table row is defined with the <tr> tag. A table header is defined with the <th> tag. By default, table headings are bold and centered. A table data/cell is defined with the <td> tag.
  34. 34. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Tables in General Tables are used to display information in tabular form. An HTML table is defined with the <table> tag. Each table row is defined with the <tr> tag. A table header is defined with the <th> tag. By default, table headings are bold and centered. A table data/cell is defined with the <td> tag. The <caption> tag defines a table caption.
  35. 35. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Tables in General Tables are used to display information in tabular form. An HTML table is defined with the <table> tag. Each table row is defined with the <tr> tag. A table header is defined with the <th> tag. By default, table headings are bold and centered. A table data/cell is defined with the <td> tag. The <caption> tag defines a table caption. The <caption> tag must be inserted immediately after the <table> tag.
  36. 36. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Let’s Practice Tables
  37. 37. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Let’s Practice Tables Create an HTML file with that will contain the following table:
  38. 38. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Let’s Practice Tables Create an HTML file with that will contain the following table: <table> <caption>Monthly savings</caption> <tr> <th>Month</th> <th>Savings</th> </tr> <tr> <td>January</td> <td>$100</td> </tr> </table>
  39. 39. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Let’s Practice Tables Create an HTML file with that will contain the following table: <table> <caption>Monthly savings</caption> <tr> <th>Month</th> <th>Savings</th> </tr> <tr> <td>January</td> <td>$100</td> </tr> </table> Examine the result.
  40. 40. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Playing Videos
  41. 41. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Playing Videos The <video> tag specifies video, such as a movie clip or other video streams.
  42. 42. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Playing Videos The <video> tag specifies video, such as a movie clip or other video streams. Currently, there are 3 supported video formats for the <video> element: MP4, WebM, and Ogg.
  43. 43. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Playing Videos The <video> tag specifies video, such as a movie clip or other video streams. Currently, there are 3 supported video formats for the <video> element: MP4, WebM, and Ogg. Firefox supports all three formats.
  44. 44. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Playing Videos The <video> tag specifies video, such as a movie clip or other video streams. Currently, there are 3 supported video formats for the <video> element: MP4, WebM, and Ogg. Firefox supports all three formats. A simple example
  45. 45. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Playing Videos The <video> tag specifies video, such as a movie clip or other video streams. Currently, there are 3 supported video formats for the <video> element: MP4, WebM, and Ogg. Firefox supports all three formats. A simple example <video width="320" height="240" controls> <source src="movie.mp4" type="video/mp4"> <source src="movie.ogg" type="video/ogg"> Your browser does not support the video tag. </video>
  46. 46. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Playing Audio Files
  47. 47. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Playing Audio Files The <audio> tag specifies sound, such as music or other audio streams.
  48. 48. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Playing Audio Files The <audio> tag specifies sound, such as music or other audio streams. Currently, there are 3 supported video formats for the <audio> element: MP3, WAV, and Ogg.
  49. 49. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Playing Audio Files The <audio> tag specifies sound, such as music or other audio streams. Currently, there are 3 supported video formats for the <audio> element: MP3, WAV, and Ogg. Firefox supports all three formats.
  50. 50. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Playing Audio Files The <audio> tag specifies sound, such as music or other audio streams. Currently, there are 3 supported video formats for the <audio> element: MP3, WAV, and Ogg. Firefox supports all three formats. A simple example
  51. 51. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Playing Audio Files The <audio> tag specifies sound, such as music or other audio streams. Currently, there are 3 supported video formats for the <audio> element: MP3, WAV, and Ogg. Firefox supports all three formats. A simple example <audio controls> <source src="song.ogg" type="audio/ogg"> <source src="song.mp3" type="audio/mpeg"> Your browser does not support the audio tag. </video>
  52. 52. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Playing Audio
  53. 53. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Playing Audio Create an HTML file with that will contain the following markup:
  54. 54. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Playing Audio Create an HTML file with that will contain the following markup: <!DOCTYPE html> <html> <body> <audio controls> <source src="hyena.wav" type="audio/wav"> Audio element not supported. </audio> <p><strong>Note:</strong> No MP3 files!</p> </body> </html>
  55. 55. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Playing Audio Create an HTML file with that will contain the following markup: <!DOCTYPE html> <html> <body> <audio controls> <source src="hyena.wav" type="audio/wav"> Audio element not supported. </audio> <p><strong>Note:</strong> No MP3 files!</p> </body> </html>
  56. 56. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . The <wbr> element
  57. 57. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . The <wbr> element The <wbr> element is used to hyphenate text.
  58. 58. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . The <wbr> element The <wbr> element is used to hyphenate text. Here is how we should hyphenate a long word:
  59. 59. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . The <wbr> element The <wbr> element is used to hyphenate text. Here is how we should hyphenate a long word: δεσοξυριβο-<wbr>ζονουκλεϊ-<wbr>νικό
  60. 60. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . The <wbr> element The <wbr> element is used to hyphenate text. Here is how we should hyphenate a long word: δεσοξυριβο-<wbr>ζονουκλεϊ-<wbr>νικό I created a really narrow page to show the effect.
  61. 61. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . The <wbr> element The <wbr> element is used to hyphenate text. Here is how we should hyphenate a long word: δεσοξυριβο-<wbr>ζονουκλεϊ-<wbr>νικό I created a really narrow page to show the effect.
  62. 62. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . How to create a narrow page?
  63. 63. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . How to create a narrow page? A narrow page is useful sometimes! Use CSS to make one.
  64. 64. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . How to create a narrow page? A narrow page is useful sometimes! Use CSS to make one. </style> body { width: 250px; margin-left: auto; margin-right: auto; background-color: lightblue; } </style>
  65. 65. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . How to create a narrow page? A narrow page is useful sometimes! Use CSS to make one. </style> body { width: 250px; margin-left: auto; margin-right: auto; background-color: lightblue; } </style> Create a web page that is 180 px wide.
  66. 66. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . How do I write an address in a HTML document?
  67. 67. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . How do I write an address in a HTML document? We need to use the <address> element.
  68. 68. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . How do I write an address in a HTML document? We need to use the <address> element. <address> 28 Oktovriou Str, 366<br> GR-671&nbsp;31&nbsp;&nbsp;Xanthi GREECE-EU </address>
  69. 69. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . How do I write an address in a HTML document? We need to use the <address> element. <address> 28 Oktovriou Str, 366<br> GR-671&nbsp;31&nbsp;&nbsp;Xanthi GREECE-EU </address> Create a web page that contains your school’s mail address.
  70. 70. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . How to semantically delete text from an HTML document?
  71. 71. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . How to semantically delete text from an HTML document? The question is: How to make crystal clear that some text is deleted and possibly replaced?
  72. 72. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . How to semantically delete text from an HTML document? The question is: How to make crystal clear that some text is deleted and possibly replaced? For example,
  73. 73. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . How to semantically delete text from an HTML document? The question is: How to make crystal clear that some text is deleted and possibly replaced? For example, Here is how we can do it:
  74. 74. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . How to semantically delete text from an HTML document? The question is: How to make crystal clear that some text is deleted and possibly replaced? For example, Here is how we can do it: <p>My favorite color is <del>blue</del> <ins>red</ins>!</p>
  75. 75. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Final Exercise!
  76. 76. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Final Exercise! Create a simple web page about your school or your family.
  77. 77. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Finale
  78. 78. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Finale I introduced HTML lists.
  79. 79. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Finale I introduced HTML lists. We talked about HTML tables.
  80. 80. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Finale I introduced HTML lists. We talked about HTML tables. I explained how one can embed video and/or sound in HTML pages.
  81. 81. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Finale I introduced HTML lists. We talked about HTML tables. I explained how one can embed video and/or sound in HTML pages. I also presented some other interesting elements.
  82. 82. Introduction to HTML5: Part II Syropoulos HTML Lists HTML Tables Video and Audio Various Elements Finale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Finale I introduced HTML lists. We talked about HTML tables. I explained how one can embed video and/or sound in HTML pages. I also presented some other interesting elements. Thank you very much for your attention!

×