HTML Quick List
HTML Quick List from W3Schools. Print it, fold it, and put it in your pocket.
**(This Box indicates what the code does)**
Before we get started..
Here are some great tutorial sites:
FTP Settings
**FTP (File Transfer Protocol) is how you transfer your website from your computer to MIT's server
You can download an FTP program, Fetch (OS X) or SecureFx (Windows), from MIT by clicking here
For more in depth, you can also check out the 'how to upload' pdf tutorial
The web settings are as follows:
| Hostname (Server): | ftp.dialup.mit.edu |
| Username: | [KERBEROS USERNAME] |
| Connection type: | SFTP |
| Password: | [KERBEROS PASSWORD] |
| Default Dir: | /afs/athena.mit.edu/ |
Your folder is usually located in the filesystem as follows:
/ afs / athena.mit.edu / user / (first letter of your user
name) / (second letter of your user name) / (your
user name)
Mine would be...
/ afs / athena.mit.edu / user / c / m / cmalcolm / www
Your website is stored at:
http://web.mit.edu/[username]
HTML Basic Document
<!DOCTYPE html>
<html>
<head>
<title>Title of document goes here</title>
</head>
<body>
Visible text goes here...
</body>
</html>
Heading Elements
<h1>Largest Heading</h1>
HEADING 1
<h2> . . . </h2>
HEADING 2
<h3> . . . </h3>
HEADING 3
<h4> . . . </h4>
HEADING 4
<h5> . . . </h5>
HEADING 5
<h6>Smallest Heading</h6>
HEADING 6
Text Elements
<p>This is a paragraph</p>
This is a paragraph
This is a paragraph
<br> (line break)
There is a break
in this sentence
<hr> (horizontal rule)
<pre>This text is preformatted</pre>
This text is preformatted
Logical Styles
<em>This text is emphasized</em>
This text is emphasized
<strong>This text is strong</strong>
This text is strong
<code>This is some computer code</code>
This is some computer code
Physical Styles
<b>This text is bold</b>
This text is bold
<i>This text is italic</i>
This text is italic
<u>This text is underline</u>
This text is underline
<span style='color: yellow'>This text is yellow</span> and <span style='color: green'>this is green</span>
It is best to use actual
hexidecimal color codes instead of color names...i.e. #FFFF00 would be yellow. #00FF00 would be green.
This text is yellow and this is green
Links
Ordinary link (Absolute):
<a href="http://www.example.com/">Link-text goes here</a>
Page link (Relative):
<a href="anotherPage.html">Link-text goes here</a>
Its important to use relative sites when your linking to your own pages, just in case you site gets moved!
Image-link:
<a href="http://catsticker.com"><img src="images/dancing-cat.gif"
alt="Alternate Text"></a>
Mailto link:
<a href="mailto:webmaster@example.com">Send e-mail</a>
A named anchor:
<a href="#top">Jump to the the Top</a>
Unordered list
<ul>
<li>Item</li>
<li>Item</li>
</ul>
Ordered list
<ol>
<li>First item</li>
<li>Second item</li>
</ol>
Tables
<table border="1">
<tr>
<th>Tableheader</th>
<th>Tableheader</th>
</tr>
<tr>
<td>sometext</td>
<td>sometext</td>
</tr>
</table>
| Tableheader | Tableheader |
|---|
| Sometext | Sometext |
Iframe
<iframe src="http://mit.edu" width=480 height=200 ></iframe>
Entities
< is the same as <
> is the same as >
© is the same as ©
Other Elements
<!-- This is a comment -->
<blockquote>
Text quoted from a source.
</blockquote>