DrQu+xum's Basic HTML primer

For posting at the Mornington Crescent Websites

(Also useful for determining what your browser can do)

Really Simple Stuff
Some More Interesting Stuff
Nesting HTML Tags
The Almighty Font Tag!
Making Special Characters
The MC Websites

Really Simple Stuff to allow you to play 99.9% of all games

What you want	What you type	What you get
Boldface	`<b>Text</b>`	Text
Italics	`<i>Text</i>`	Text
Underline	`<u>Text</u>`	Text
Large type (simple)	`<big>Text</big>`	Text
Small type (simple)	`<small>Text</small>`	Text
Fixed width type	`<tt>Text</tt>`	`Text`
Hyperlink	`<a href="http://parslow.com/mornington">MCiOS</a>`	MCiOS
Horizontal line	`<hr>`
New line	`<br>`
New paragraph with spacing	`<p>Whole paragraph</p>`	Whole paragraph

Some more interesting stuff if you want to make/break friends and influence/irritate people

* denotes a tag which shouldn't be used for normal posting, as it causes annoyance.

What you want	What you type	What you get
Superscript type	`Text<sup>Text</sup>`	Text^Text
Subscript type	`Text<sub>Text</sub>`	Text_Text
Stricken type	`<strike>Text</strike>`	~~Text~~
*Blinking type	`<blink>Text</blink>`	Text
*Scrolling Type	`<marquee>Long line of text</marquee>`	Long line of text
Inline image	`<img src="pics/mc-logo.png">`
Numbered list	`<ol type="1"><li>First item<li>Second Item</ol>`	First item Second Item
Roman Numeral list	`<ol type="I"><li>First item<li>Second Item</ol>`	First item Second Item
Bulleted list	`<ul><li>First item<li>Second Item</ul>`	First item Second Item
*Preformatted text	`<pre>Text text text. More text text. More more text.</pre>`	Text text text. More text text. More more text.

Nesting HTML Tags

HTML tags can be put one inside each other in order to combine effects. Keep it down, though, as too much of it can make you look like a dork.

What you want	What you type	What you get
Bold & italic type	`<b><i>Text</i></b>`	*Text*
Big type with some fixed-width in-between	`<big>Text <tt>Other text</tt> More text</big>`	Text `Other text` More text
A mathematical formula	`<i>e<sup>iπ</sup>+1=0</i>`	e^iπ+1=0
Scrolling image	`<marquee><img src="http://mustela.phyast.pitt.edu/pics/noo.gif"</marquee>`
Just a bunch of effects^*	`<u>Don<blink>'t t</u>ry t<b>his </blink>at </b>home.`	Don't try this at home.

Be nice to everyone...make sure you close all of your tags.
^*-This is not guaranteed to work on all browsers.

The Almighty Font Tag!

The tag has three major modifiers: "color", "size", and "face".
, where n is either a number from 1 to 7 or from -2 to +4, determines the size of the type. A number without a sign is absolute (regular type is 3), whereas a number with a sign is relative to the current size.

What you want	What you type	What you get
Largest font possible	<font size="7">Text</font>	Text
Normal size font	<font size="3">Text</font>	Text
Smallest font possible	<font size="1">Text</font>	Text
Font two sizes bigger	<font size="+2">Text</font>	Text
Font one size smaller	<font size="-1">Text</font>	Text

determines the color of the text. "rr", "gg", and "bb" are three hexadecimal numbers denoting the level of red, green, and blue in the color. Having none of a level is "00", a small amount is "40", a medium amount is "80", a large amount is "C0", and the full amount is "FF". Note that any hexadecimal number from "00" to "FF" is possible, thus allowing for 16.7 million colors (for those of you who really want to know: 2²⁴=16,777,216)
Some browsers will interpret the name of a common color; this is not always standard. Click here for a list of colors.

What you want	What you type	What you get
White text	<font color="#FFFFFF">Text</font>	Text
Green text	<font color="#00FF00">Text</font>	Text
Navy blue text	<font color="#000080">Text</font>	Text
Orange text	<font color="#FF8000">Text</font>	Text
Lilac text	<font color="#B080FF">Text</font>	Text
Puce text	<font color="#913668">Text</font>	Text
Red text (by name)	<font color="red">Text</font>	Text

determines the font. You should be aware that not everyone has every font; for politeness, use one of the three major font selections listed below. You may use a list of fonts (as below), but it should be sufficient (and sometimes preferable) to specify "Sans Serif", "Serif", or "Monospace" alone.

What you want	What you type	What you get
Sans Serif text	<font face="Sans Serif, Helvetica, Arial">Sans Serif Text</font>	Sans Serif Text
Serif text	<font face="Serif, Times, Times New Roman">Serif Text</font>	Serif Text
Fixed-width text	<font face="Monospace, Courier New, Courier">Fixed-Width Text</font>	Fixed-Width Text

The color, face and size modifiers can exist in the same tag.

What you want	What you type	What you get
Big blue text (by name)	<font color="blue" size="7">Text</font>	Text
Little gray text (by number)	<font color="#808080" size="1">Text</font>	Text
Fairly large italicised hampster text (by number)	<i><font color="#8B4513" size="5">Text!</font></i>	Text!
Smaller-than-normal boldfaced Serif text	<b><font size="-1" face="Serif">Text?</font></b>	Text?
Larger-than-normal purple Sans Serif text	<font size="+2" face="Sans Serif" color="purple">More text</font>	More text

Making Special Characters

Some characters not found on normal keyboards can be made with special codes. Note that not all browsers will support these characters.

Typographical, mathematical and currency			Capital diacritical characters			Small diacritical characters
What you want	What you type	What you get	What you want	What you type	What you get	What you want	What you type	What you get
Ampersand	&	&	A+acute	Á	Á	a+acute	á	á
Less than/left angle bracket	<	<	A+grave	À	À	a+grave	à	à
Greater than/right angle bracket	>	>	A+circumflex	Â	Â	a+circumflex	â	â
Non-breaking Space			A+umlaut	Ä	Ä	a+umlaut	ä	ä
Pound	£	£	A+tilde	Ã	Ã	a+tilde	ã	ã
Euro	€	€	A+circle, Ångstrom	Å	Å	a+circle	å	å
Cent	¢	¢	AE ligature	Æ	Æ	ae ligature	æ	æ
Yen	¥	¥	C+cedilla	Ç	Ç	c+cedilla	ç	ç
Copyright	©	©	E+acute	É	É	e+acute	é	é
Registered Trademark	®	®	E+grave	È	È	e+grave	è	è
Trademark	™	™	E+circumflex	Ê	Ê	e+circumflex	ê	ê
Degrees	°	°	E+umlaut	Ë	Ë	e+umlaut	ë	ë
Micro (lower case mu)	µ	µ	I+acute	Í	Í	i+acute	í	í
Plus/Minus	±	±	I+grave	Ì	Ì	i+grave	ì	ì
Multiplication	×	×	I+circumflex	Î	Î	i+circumflex	î	î
Division	÷	÷	I+umlaut	Ï	Ï	i+umlaut	ï	ï
Infinity	∞	∞	Eth	Ð	Ð	eth	ð	ð
Pi (lower case)	π	π	N+tilde	Ñ	Ñ	n+tilde	ñ	ñ
One Quarter	¼	¼	O+acute	Ó	Ó	o+acute	ó	ó
One Half	½	½	O+grave	Ò	Ò	o+grave	ò	ò
Three Quarters	¾	¾	O+circumflex	Ô	Ô	o+circumflex	ô	ô
Square	²	²	O+umlaut	Ö	Ö	o+umlaut	ö	ö
Cube	³	³	O+tilde	Õ	Õ	o+tilde	õ	õ
Radical/Square Root	√	√	O+slash	Ø	Ø	o+slash	ø	ø
Per Thousand	&permil;	‰	OE ligature	&OElig;	Œ	oe ligature	&oelig;	œ
Ellipsis	…	…	S+caron	&Scaron;	Š	s+caron	&scaron;	š
Section Mark	§	§				sz ligature	ß	ß
Paragraph Mark	¶	¶	U+acute	Ú	Ú	u+acute	ú	ú
Carriage Return Mark	&crarr;	↵	U+grave	Ù	Ù	u+grave	ù	ù
Dagger	&dagger;	†	U+circumflex	Û	Û	u+circumflex	û	û
Double Dagger	&Dagger;	‡	U+umlaut	Ü	Ü	u+umlaut	ü	ü
Bullet	•	•	Y+acute	Ý	Ý	y+acute	ý	ý
Inverse Question Mark	¿	¿	Y+umlaut	&Yuml;	Ÿ	y+umlaut	ÿ	ÿ
Inverse Exclamation Mark	¡	¡	Thorn	Þ	Þ	thorn	þ	þ
Spade	&spades;	♠
Club	&clubs;	♣
Heart	&hearts;	♥
Diamond	&diams;	♦

Advanced mathematical characters			Capital Greek letters			Small Greek letters
What you want	What you type	What you get	What you want	What you type	What you get	What you want	What you type	What you get
Summation	∑	∑	Alpha	Α	Α	alpha	α	α
Product	∏	∏	Beta	Β	Β	beta	β	β
Angle	&ang;	∠	Gamma	Γ	Γ	gamma	γ	γ
Perpendicular	&perp;	⊥	Delta	Δ	Δ	delta	δ	δ
Proportional	&prop;	∝	Epsilon	Ε	Ε	epsilon	ε	ε
Integral	∫	∫	Zeta	Ζ	Ζ	zeta	ζ	ζ
Partial differential	∂	∂	Eta	Η	Η	eta	η	η
Similar	&sim;	∼	Theta	Θ	Θ	theta	θ	θ
Approx. equal to	&cong;	≅				theta (alternate)	&thetasym;	ϑ
Almost equal to	≈	≈	Iota	Ι	Ι	iota	ι	ι
Equivalence/Identity	&equiv;	≡	Kappa	Κ	Κ	kappa	κ	κ
Not equal	≠	≠	Lambda	Λ	Λ	lambda	λ	λ
Less than or equal to	≤	≤	Mu	Μ	Μ	mu	μ	μ
Greater than or equal to	≥	≥	Nu	Ν	Ν	nu	ν	ν
Subset	⊂	⊂	Xi	Ξ	Ξ	xi	ξ	ξ
Superset	⊃	⊃	Omicron	Ο	Ο	omicron	ο	ο
Subset or equal	&sube;	⊆	Pi	Π	Π	pi	π	π
Superset or equal	&supe;	⊇				pi (alternate)	ϖ	ϖ
Not subset	&nsub;	⊄	Rho	Ρ	Ρ	rho	ρ	ρ
Intersection/Setwise and	∩	∩	Sigma	Σ	Σ	sigma	σ	σ
Union/Setwise or	∪	∪				sigma (final)	&sigmaf;	ς
Logical and	&and;	∧	Tau	Τ	Τ	tau	τ	τ
Logical or	&or;	∨	Upsilon	Υ	Υ	upsilon	υ	υ
Is part of	∈	∈				upsilon (alternate)	&upsih;	ϒ
Isn't part of	∉	∉	Phi	Φ	Φ	phi	φ	φ
Contains	&ni;	∋	Chi	Χ	Χ	chi	χ	χ
"For All"	∀	∀	Psi	Ψ	Ψ	psi	ψ	ψ
"There Exists"	∃	∃	Omega	Ω	Ω	omega	ω	ω
"Therefore"	&there4;	∴
Null set	∅	∅
Complex real part	&real;	ℜ
Complex imaginary part	&image;	ℑ
Transfinite cardinal	&alefsym;	ℵ

Now, go to it!

Mornington Crescent In Outer Space	Orange MC	mc5

� 2004, DrQu+xum. Distribution of this document is permitted as long as the copyright notice and revision history remain intact.
This entire page written in vi. Yes, I am hardcore.
Thanks to: MCiOS logo � 2004,1997 Dan. Orange MC logo � 2003 Dunx. MC5 logo � 2003 Projoy & rab.
Revision History:

20170709: Updated the page link to MC5. Made a brief change to the table of contents and character list.
20160307: Wow, this page is old. New e-mail address.
20090422: Revived this page at http://www.pitt.edu/~greg4/basichtml.html -- other links will be fixed sometime.
20050915: Correction in color table.
20041202: Added more mathematical and Greek symbols.
20041201: Added font face section. Amended distribution policy.
20040124: Nesting HTML Tag section added.
20040122: Presented to the MC nation.
20040116: Added color chart page (offsite).
20040113: Added puce and hampster colors. Thanks, JLE.
20040112: Added and <pre> tags, font color quoting,   correction, correction. Added my e-mail address. Thanks, Dunx, Dan, and rab.
20040107: Original draft.