HTML Guide

<!DOCTYPE html>
<html>
	<body>
		Content

		<h1>Really important heading!</h1>
		<h2>Secondary heading</h2>
		<h3>Tertiary heading</h3>
		<h4>Other heading</h4>
		<h5>Minor heading</h5>
		<h6>Very minor heading</h6>

		<p>Paragraph</p>

		<a href="https://modarchive.org">Check out Mod Archive!</a>
		<img src="/cat.png">
		<a href="https://link.com"><img src="img.jpg"	onmouseover="this.src='hover-img.jpg'"	onmouseout="this.src='img.jpg'"></a>

		<strong>bold</strong>
		<em>italic</em>
		<small>smaller text</small>

		<ul>
  			<li>list1</li>
  			<li>list2</li>
  			<li>list3</li>
		</ul>

		<hr> horizontal rule, linebreak

		<textarea readonly="readonly" class="source" rows="20" cols="20">textbox</textarea>

		<footer>
			<p class="timestampe"></p>
		</footer>
	</body>
</html>

<script src='http://www.midijs.net/lib/midi.js'></script>
<script>MIDIjs.play('path/to.your/file.mid');</script>

<script type='text/javascript' src='http://www.midijs.net/lib/midi.js'></script>
	<a href="#" onClick="MIDIjs.play('/midi/runescape-garden.mid');">Play</a>
	<a href="#" onClick="MIDIjs.stop();">Stop</a>

CSS:

a {}
a:link {}
a:visited {}
a:hover {}
a:active {}