160 likes | 267 Views
Writing HTML Document. HTML Reference http://www.w3.org M:CompHTML_RefHtmlref.hlp. Basics. <html> <head> <title> … </title> </head> <body> </body> </html>. Formatting Tag. Paragraph : <p align=left | right | center> … </p> Line Break : <br>
E N D
Writing HTML Document • HTML Reference • http://www.w3.org • M:\Comp\HTML_Ref\Htmlref.hlp
Basics • <html> • <head> • <title> … </title> • </head> • <body> • </body> • </html>
Formatting Tag • Paragraph : <p align=left | right | center> … </p> • Line Break : <br> • Font : <font face=“name” color=“name”> … </font> • Bold : <b> … </b> • Italic : <i> … </i> • Underline : <u> … </u> • Indentation: <blockquote> … </blockquote> Example
List Tag • Numbering : <ol> … </ol> • Bullet : <ul> … </ul> • List Item : <li> … </li>
Image Tag • <img src=“filename” alt=“text”> Example
Hyperlink Tag • <a name=“bookmarks” | href=“web_site_address” • target=“window_name”> … </a> Example
Table Tag • Table : <table width=“percentage”> … </table> • Row : <tr> … </tr> • Cell : <td> … </td> Example
Frame Tag • Defining Frame : <frameset> … </frameset> • Frame : <frame name=“frame_name” src=“filename”> Example
Formatting Example • <p><font face=“Arial” color=“blue”>This is my first HTML document.</font></p> • <p><b><i><u>This sentence will be bold, italic and underlined.</u></i></b></p> • <blockquote> • <p>This sentence will be indented.</p> • </blockquote> Back
List Example - Numbering • <ol> • <li>Item one.</li> • <li>Item two.</li> • <li>Item three.</li> • </ol> Back
List Example - Bullet • <ul> • <li>Item one.</li> • <li>Item two.</li> • <li>Item three.</li> • </ul> Back
Image Example • <p align=“center”> • <img src=“mcmug.gif” alt=“McMug”> • </p> Back
Hyperlink Example • Setup a hyperlink • <a href=“http://www.hssc.edu.hk”> • Hang Seng School of Commerce • </a> • Setup a hyperlink in a new window • <a href=“http://www.hssc.edu.hk” target=“new”> • Hang Seng School of Commerce • </a>
Hyperlink Example • Defining a bookmark • <a name=“top”> • Top of the Document • </a> • Setup a hyperlink to a bookmark • <a href=“#top”> • Back to Top • </a> Back
Table Example • <table width=100%> • <tr> • <td>Column A</td><td>Column B</td> • </tr> • <tr> • <td>Item 1</td><td>Item 2</td> • </tr> • </table> Back
Frame Example • Defining frame • <frameset cols=“25%,*”> • <frame name=“a” src=“menu.htm”> • <frame name=“b” src=“contents.htm”> • </frameset Back