HTML Cheatsheet
HTML for Ecademy messages/blogs/Marketplace/Profiles
Basic
Make bold text
Make <b>bold</b> text
Make Italic text
Make <i>Italic</i> text
Make underlined
Make <u>underlined</u>
Make linked
Make <a href=”http://www.ecademy.com/profile.php”>linked</a>
popup
<a href=”http://www.ecademy.com/profile.php” target=”_blank”>popup</a>
Advanced
Red text
<span style=”color:#ff0000”>Red text</span>
Red Bold Text
<span style=”color:#ff0000”>Red <b>Bold</b> Text</span>
Black border box
<div style=”border:1px solid #000000”>Black border box</div>
Grey text on black <div style=”background: #000000; color:#dddddd;”>Grey text on black</div>
Red text on grey
<div style=”background:#dddddd; color:#ff0000;”>Red text on grey</div>
Insert an image
<img src=”http://www.ecademy.com/themes/ecademy/logo_ecademy_topleft.gif”>
(images must be uploaded to a website first www.flickr.com is popular)
Colour Guide
eg. Black = #000000, Navy = #000099, Red = #FF0000 etc
There are many many more, so if you want a colour which isn't here, Google 'HTML color codes' for a longer list.
Notes
Please note the spelling of 'Color' – It is common knowledge that the American's can't spell yet claim to
use the English language. As they also developed HTML code, please direct your complaints to them as a
country.
HTML though complicated to look at for a non-techie is actually very simple. Follow a few simple rules
and you'll hopefully be typing up colourful blogs and profiles in no time.
Short explanation of html:
Html works in tags, a tag is made up of 4 parts:
<
1
a
2
href=”http://www.image.com”>
3
Click Here
4
</a>
5
1. The opener, this signifies the start of non-text input.
2. The tag, a = link (anchor), b = bold, I = Italic, img = image
3. The options (optional), tell it how to display it and where relevant any urls.
4. The text to apply the effect to (Images do not need this)
5. The closer. (Images do not need this, most other elements do)
Everything inside < and > is treated as code and will not display (You'll notice this when using the