80 likes | 265 Views
How to create Web Pages. Some relevant websites. http://www.web-source.net/html_codes_chart.htm http://www.quackit.com/html/codes/ ???? http://www.w3schools.com/html/html_intro.asp http://www.w3schools.com/default.asp http://www.webmonkey.com/2010/02/html_cheatsheet/
E N D
Some relevant websites • http://www.web-source.net/html_codes_chart.htm • http://www.quackit.com/html/codes/ ???? • http://www.w3schools.com/html/html_intro.asp • http://www.w3schools.com/default.asp • http://www.webmonkey.com/2010/02/html_cheatsheet/ • http://www.davesite.com/webstation/html/ (very commercial)
Basic web page structure • <html> • <head> • <title>A page title</title> • </head> • <body> • (body of web page) • </body> • </html>
Some basic HTML tags • For sub-headings: • <h1>heading</h1> Recognized are headings h1-h6 • h1 is largest, h6 is smallest. • Changing emphasis: • <b> (bold) • <big> • <em> (emphasis) • <i> (italic) • <small> • <strike> • <strong> • <tt> (teletype font) • <u> (underline)
A few more simple HTML tags • <a href=”...”> </a> used for links • <br> breaks a line. • <center> .... </center> • <dl> <!-- definition list --> <dt>term</dt> <dd>definition</dd> <!-- repeatable --> </dl> • <font face=”<name>” size=”nr” color=”x“>...</font> • <hr width=”x%” size=”n” /> (width, size are optional) • <p align=”left/right/center”>.....</p>
Unordered lists • <ul> or <ul type=”disc”> or <ul type =”circle”> • <li>List item</li> • <li>List item</li> • . • . • </ul> • Notes: • Can place lists inside lists • It is a good idea to place a <br> before and after
Ordered Lists • Similar syntax to unordered lists, but are numbered/lettered. Start at 1 unless otherwise indicated. Elements indicated by <li>/</li> pairs as usual. Variants: • <ol> numbered • <ol type=”a”> lettered a. b. … • <ol type=”A”> lettered A. B. … • <ol type=”i”> lowercase roman numerals • <ol type=”I”> Capital roman numerals • Add start=”number” if need special start. Example: • <ol type=”a” start=”3”> will label the items c d e ...
Tables • <table> • <tr> • <th>Heading</th><th>Heading></th>..... • </tr> • <tr> • <td>data</td><td>data</td>... • </tr> • … • </table> • Can add attributes border= cellspacing= cellpadding= to table tag. Values in pixels. (if no border attribute, table will not have a border).