HTML -
•     Web 2 – HTTP      –           –HTTPS      –  FTP      –           –       HTML    •
World Wide Web                   •               Web Browser                               •  HyperText Markup Language   ...
Web 2        •        •        •        •        •        •
HTTP HyperText Transfer Protocol HTTP          •          Request-Responce      -   HTTP   •                Stateless     ...
Web Browser   •  HTTP                        •HTML                          •                HTML                         ...
HTTPS                                         HTTP          •       HTTP     Secure HTTP HTTPS                            ...
FTP         File Transfer Protocol   FTP   •  HTTP                                  FTP                           FTP     ...
••
HTML
HTML                                                        •                                            HTML        •    ...
•                                                          –                                                          –   ...
XML                  •    <html>         HTMLHTML                                 XML                  •HTML 4.01 Strict<!...
XHTML 1.0 Strict<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict....
Head                                         HTML              •                                                          ...
HTML             •                            .1          ASCII        .1                       .2        Unicode        ....
HTML  Space   whitespace                      .1           <>&                            .2                           &lt...
HTML
HTML    •                              HTML              •     CSS                                         HTML   •       ...
<html>                                      HTML    •                               HTML                  HTML            ...
<html><html dir=rtl lang=fa><head></head><body></body></html><html><head></head><body>Hello, World! </body></html>
<head>                              Head                       Html  body          head                 •         head
<title>                 Title          Head                         •
<title><html lang=fa><head>   <title>         </title></head><body></body></html>
<p>                        P                        Align –                     Left    •                    Right    •   ...
<br>       Br
<img>                                               Img                                                   src –           ...
<img><html><head>   <title>          title></head><body><p>                                 <br/><img src=image1.jpg width...
<a>                  A      URL         href –                 Name –                Target –             _blank •        ...
<a><html><body>   <p> This is a sample paragraph. Click   <a href=http://www.google.com>Here</a>   to visit Google website...
<b>                                 B                          Bold                     Body      small   big     i       ...
<sup>,<sub>                                  Sup, Sub                             Body              small   big     i     ...
<hr>                                     Hr       Horizontal Line                         Body  hr                        ...
<sub>,<sup><html><body>   Some text with   <sup>super</sup>   text.   <hr/>   Some more text with   <sub>sub</sub>   text....
<ol>,<ul>                                     OL,UL  Unordered List   Ordered List                              Body      ...
<li>                     LI       List Item             UL OL
<html><body>   <ol>   <li>           li>   <li>           li>   <li>            li>   </ol>   <ul>   <li> List 1</li>   <l...
Span, DivHTML                            •       HTML                        Span    •                         Div    •   ...
HTML        HTML                                 •                                         –                              ...
<Table>                 Table                 Border   –            Cellpadding   –            Cellspacing   –            ...
<Tr>                                  Tr            Table Row                                  Align –                    ...
<Td>                               Td       Table Data                               Align   –                            ...
<html><body>    <table border=1>    <tr> <td>Cell 11</td>           <td>Cell 12</td>    </tr><tr>           <td>Cell 21</t...
<Tbody>                               Tbody          Table Body                                  Align –                  ...
<Thead>                                 Thead          Table Header                                    Align –            ...
<Tfoot>                                 Tfoot          Table Footer                                   Align –             ...
<Th>                                Th Table Header Data                                 Align –                          ...
<html><body>    <table border="1">    <thead><tr>           <th>Month</th>           <th>Pays</th>    </tr></thead><tbody>...
Border                      •                      CSS   •                            •         DOCTYPE            •      ...
HTML                             HTTP                             •        HTML   Submit                    HTML          ...
<form>                            Form               HTML         •                                   Submit              ...
<input>                                   •type                     Button    –                  Checkbox     –           ...
<input><html><body><form method=get><input type=checkbox> I am a checkbox! <br/><input type=file> <br/><input type=passwor...
<input>    input                                        •                                input         Checkbox Radio     ...
<input><html><body><form method=getaction=http://google.com/search>                                   <br/><input text val...
<textarea>                                        <textarea>        •                                           readonly  ...
<select>               Dropdown Combo       Select       •               Select    Mutiple                 •           Opt...
<select><html><body><select>   <option value=Wood>    </option>   <option value=Iron> </option>   <option value=Stone>   <...
<label>,<fieldset>                                                       •                                             Lab...
HTML                                        •                                                         –             CSS   ...
HTML                          •                                              CSS            Style –                       ...
HTML   .1                     SBCE          .2      IE   Firefox                                   .3            Download....
HTML Training Course in Persian
HTML Training Course in Persian
HTML Training Course in Persian
HTML Training Course in Persian
HTML Training Course in Persian
HTML Training Course in Persian
HTML Training Course in Persian
Upcoming SlideShare
Loading in...5
×

HTML Training Course in Persian

5,098

Published on

This is a kick-start HTML tutorial. with this you could easily learn HTML in a few days. In PERSIAN.

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

  • Be the first to like this

No Downloads
Views
Total Views
5,098
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
2
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

HTML Training Course in Persian

  1. 1. HTML -
  2. 2. • Web 2 – HTTP – –HTTPS – FTP – – HTML •
  3. 3. World Wide Web • Web Browser • HyperText Markup Language HTML • • Hyperlink •World Wide Web Consortium (W3C) • Internet Engineering Task Force (IETF) •
  4. 4. Web 2 • • • • • •
  5. 5. HTTP HyperText Transfer Protocol HTTP • Request-Responce - HTTP • Stateless HTTP • GET POST • HTML • HTML •
  6. 6. Web Browser • HTTP •HTML • HTML • Internet Explorer • Firefox Google Chrome
  7. 7. HTTPS HTTP • HTTP Secure HTTP HTTPS • Secure Sockets Layer SSL Transport Layer Security TLS HTTPS • Digital Certificate HTTPS •
  8. 8. FTP File Transfer Protocol FTP • HTTP FTP FTP • – – FTP • HTTP HTML
  9. 9. ••
  10. 10. HTML
  11. 11. HTML • HTML • Word PDF • Markup Language Tag HTML • XML HTML • • /<tagName>tagdata here, as mush as you want </tagName>
  12. 12. • – – – • •<tag attribute1=“attributeValue” attribute2=“attributeValue2”><innerTag> some data <anotherInnerTag /> </innerTag></tag> •
  13. 13. XML • <html> HTMLHTML XML •HTML 4.01 Strict<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">HTML 4.01 Transitional<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"HTML 4.01 Frameset<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
  14. 14. XHTML 1.0 Strict<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">XHTML 1.0 Transitional<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1- transitional.dtd">XHTML 1.0 Frameset<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1- frameset.dtd">XHTML 1.1 (strict)<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  15. 15. Head HTML • Body<html><head> <title> Sample Webpage </title></head><body> <p> hello there this is a paragraph </p> <p> hello again another paragraph with <b> bold </b> text! </p></body></html>
  16. 16. HTML • .1 ASCII .1 .2 Unicode .3UTF-8 .2 Enter
  17. 17. HTML Space whitespace .1 <>& .2 &lt; < .1 &gt; > .2 &amp; .3 HTML .3 Microsoft Frontpage .1 Adobe Dreamweaver .2 ZendStudio for Eclipse .3
  18. 18. HTML
  19. 19. HTML • HTML • CSS HTML • Comments<!-- this is a comment! --> HTML •
  20. 20. <html> HTML • HTML HTML • “ltr” “rtl” Dir – rtl “en” “fa” Lang –
  21. 21. <html><html dir=rtl lang=fa><head></head><body></body></html><html><head></head><body>Hello, World! </body></html>
  22. 22. <head> Head Html body head • head
  23. 23. <title> Title Head •
  24. 24. <title><html lang=fa><head> <title> </title></head><body></body></html>
  25. 25. <p> P Align – Left • Right • Center • Justify • RTL Body
  26. 26. <br> Br
  27. 27. <img> Img src – Alt – top, bottom, middle, left , right Align – Width , Height – Tooltip Title – Usemap – Title HTML Body
  28. 28. <img><html><head> <title> title></head><body><p> <br/><img src=image1.jpg width=200align=middle/></p><p> </p><img src=image1.jpg width=200height=200 /></body></html>
  29. 29. <a> A URL href – Name – Target – _blank • _parent • _self • • Body
  30. 30. <a><html><body> <p> This is a sample paragraph. Click <a href=http://www.google.com>Here</a> to visit Google website. <br/> <a href=http://hackersite.com/hack.html title=Click me to die!>Yahoo!</a> <br/><br/> <a href=http://somesite.com/somepage.html#anchor> <img src=img.gif /> </a></body></html>
  31. 31. <b> B Bold Body small big i css
  32. 32. <sup>,<sub> Sup, Sub Body small big i css
  33. 33. <hr> Hr Horizontal Line Body hr br
  34. 34. <sub>,<sup><html><body> Some text with <sup>super</sup> text. <hr/> Some more text with <sub>sub</sub> text.</body></html>
  35. 35. <ol>,<ul> OL,UL Unordered List Ordered List Body li li
  36. 36. <li> LI List Item UL OL
  37. 37. <html><body> <ol> <li> li> <li> li> <li> li> </ol> <ul> <li> List 1</li> <li> List 2</li> <li> List 3</li> </ul></body></html>
  38. 38. Span, DivHTML • HTML Span • Div • Div CSS •
  39. 39. HTML HTML • – – – Table • Body Header • Footer •
  40. 40. <Table> Table Border – Cellpadding – Cellspacing – Width – Body
  41. 41. <Tr> Tr Table Row Align – VAlign – Top • Middle • Bottom • Baseline • Table,Tbody,Thead,Tfoot
  42. 42. <Td> Td Table Data Align – VAlign – Colspan – Rowspan – tr,th
  43. 43. <html><body> <table border=1> <tr> <td>Cell 11</td> <td>Cell 12</td> </tr><tr> <td>Cell 21</td> <td>Cell 22</td> </tr></table> <hr/> <table border=1> <tr> <td rowspan=2>Cell 11 <br/>Cell 21</td> <td>Cell 12</td> </tr><tr> <!-- Cell 21 ommited --> <td>Cell 22</td> </tr></table></body></html>
  44. 44. <Tbody> Tbody Table Body Align – VAlign – Table
  45. 45. <Thead> Thead Table Header Align – VAlign – Table
  46. 46. <Tfoot> Tfoot Table Footer Align – VAlign – Table
  47. 47. <Th> Th Table Header Data Align – VAlign – Thead>Tr
  48. 48. <html><body> <table border="1"> <thead><tr> <th>Month</th> <th>Pays</th> </tr></thead><tbody><tr> <td>January</td> <td>$100</td> </tr><tr> <td>February</td> <td>$80</td> </tr></tbody><tfoot><tr> <td>Sum</td> <td>$180</td> </tr></tfoot></table></body></html>
  49. 49. Border • CSS • • DOCTYPE • bazitab.com •
  50. 50. HTML HTTP • HTML Submit HTML • Get • Post Get • URL Get – Post – Get Post •http://hosting.pershe.com/viewticket.php?tid=109338&c=X4jQ3Ukc c , tid Get
  51. 51. <form> Form HTML • Submit Enter • Get/Post Method – Action – •<form></form><form action=„getData.php‟ method=„get‟></form><form action=„http://google.com/‟ method=„get‟></form>
  52. 52. <input> •type Button – Checkbox – File – Hidden – Password – Radio Radio – Text – Submit – Reset –
  53. 53. <input><html><body><form method=get><input type=checkbox> I am a checkbox! <br/><input type=file> <br/><input type=password value=sth> <br/><input type=radio> Radio button! <br/><input type=text value=Normal!> <br/><input type=submit> | <input type=button></form></body></html>
  54. 54. <input> input • input Checkbox Radio Checked – Checked=„Checked‟ or else Disabled – password text MaxLength – password text Readonly – Size – Value – Name –
  55. 55. <input><html><body><form method=getaction=http://google.com/search> <br/><input text value=Search String /><br/><input type=submit value=Search><br/></form></body></html>
  56. 56. <textarea> <textarea> • readonly • cols rows • • textarea<textarea rows=„5‟ cols=„10‟>HelloThere</textarea> textarea <br/> HTML
  57. 57. <select> Dropdown Combo Select • Select Mutiple • Option Select • Selected Option • Value Value Option •
  58. 58. <select><html><body><select> <option value=Wood> </option> <option value=Iron> </option> <option value=Stone> </option></select></body></html>
  59. 59. <label>,<fieldset> • Label For Label •<label for=„myname‟>Enter your name:</label><input type=„text‟ name=„myname‟ /> fieldset • Radio<fieldset><input type=„radio‟><input type=„radio‟></fieldset><fieldset><input type=„radio‟><input type=„radiou‟></fieldset>
  60. 60. HTML • – CSS Class • HTML Id • CSSCSS Style • Title • – RTL LTR Dir • – Tabindex • Tabindex TAB
  61. 61. HTML • CSS Style – Javascript Script – Head Meta – HTTP Header Content • Header http-equiv • Name • Link – Rel • Href • Type •<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
  62. 62. HTML .1 SBCE .2 IE Firefox .3 Download.com .4 .5IMG .6
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×