User:Catfish Jim and the soapdish/explan

First, click on "Edit source" and you see a bunch of text that can be a bit difficult to understand. The weird symbols and syntax are known as wiki markup language and simply instructs the Wikipedia software how to display the page.

Hidden text
The first line is this:

All this does is hide a little bit of text as a message to anyone reading the page source. Any time you want to do this, you just wrap the text in the following tags:



By the way, I'm getting those tags to appear by wrapping them in these tags:



and

Border
The next line is this:

This is simply to mark where the information about the page border is, again wrapped in hidden text tags. The software doesn't read it, it's purely for the (human) reader's info. Next is a line that is more interesting, as it's the first that tells the WP software to do something.
 * 

What this is doing is drawing a big, light-blue rectangle that surrounds the whole user page.

is a tag that with the corresponding  tag (in this case at the very end of the page) defines the block that we want to color in.
 * <div style="padding: 10px;

defines the div tag as a 10 pixel pad. Don't worry about it... it thickens the border.
 * <div style="padding: 10px; background: #8AC1FF;

the background: #8AC1FF; defines the border color. It's in a standard format that is in hexidecimal RGB format. This tells the software how much red, green and blue a color is made of. The digits, instead of going from 0 to 9, go from 0 to F, i.e: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F, and a two digit number goes from 00 (= 0) to FF (=255). Our color is made up of 8A red = 138 out of 255, C1 green = 193 out of 255 and FF blue = 255 out of 255. This is the nice light blue that makes up the border of your user page. The extra bit where it says "border: 1px solid :#8AC1FF;" adds another border... I can't remember why I did that, but there was a good reason! The rest defines the font and font size on the page.

Heading 1


Again, just for information, to tell the reader what we're doing.
 * {| style="text-align:left; border: 0px solid #8AC1FF; background-color:#8AC1FF"

! style="font-family: Constantia, sans-serif; color: #000000; font-size: 24pt; line-height: 1.0em;" colspan="2"|Leahtwosaints A lot going on there. What it says is to put a big light blue (same colour as border) band at the top, with "Leahtwosaints" written in big black letters at the top, and a big fairy at the top right.
 * - padding:1em;padding-top:0.5em;"