Kk, I was asked today on how to edit my profile, which all these weird and crazy colors and an awesome background pic! :D Its really quite simple, not much thought goes into it at all. Though you have to understand the basics of css and html, but I won't go into html in this blog/tutorial, just the css aspect of it so you get an understanding of how to edit your profile to your liking.
 
What you need:
1: a brain (kinda? :D)
2: a keyboard (duh)
3: a basic knowledge of the css (cascading style sheets) style coding
 
Basically, what css is is just an easier way to style your website, nested in the headers of the html, the coding isnt seen, but everything else is, the colors, the fonts, and everything else. If you know c++ you might get used to this pretty fast.
 
Lets take a look at the code I used for my profile:
body
{
background-image:url('http://images2.layoutsparks.com/1/248157/grim-myspace-reaper-scythe.jpg');
background-repeat:no-repeat;
background-attachment:fixed;
}

span
{
color:#B00000;
font-family:"comic sans ms";
font-size:15px;
}

h1,h2,h3,h4,h5,h6
{
color:#7FFF00;
}

a:link
{
color:#00FF00;
font-family:Trebuchet;
font-size:15px;
}

a:visited
{
color:#FFFF00;
font-family:Trebuchet;
font-size:15px;
}

a:hover
{
text-decoration:underline;
font-family:"segoe print";
color:#FF4500;
}
 
~~Alright? Thats what makes my profile look the way it does now. Though, you might ask "wtf does that all do?!", I'll explain it line by line.
body
~~The body of your website, much like a letter, a website has to have a body, this is where the meat and bread of your site is, and its a real pain in the ass to go and edit every html sheet you have on a website just for the body.
{
~~Your opening brackett, this is necessary for the "nest" of code that is to follow.
background-image:url('http://images2.layoutsparks.com/1/248157/grim-myspace-reaper-scythe.jpg');
~~This here, is just your basic background picture, this adds a picture to the background of your website/profile if you're using it here, it can be used for many different styles of backgrounds. Much like c++, you have your arguements in your parintheses (did I spell that right?), which is the picture file in between the ' ', these are necessary because without them, the picture wont show up.
background-repeat:no-repeat;
~~This is just a background repeat command, I have chosen a no-repeat because I do not want it to repeat across the board, and I will explain in the next line. Though you have the x and the y axis on your monitor, and thus, you can have "background-repeat:x" to repeat the x axis, or "background-repeat:x,y" to repeat both up and down. This just tiles the picture across the site.
background-attachment:fixed;
~~Now this, this is why I decided not to tile the pictures in my profile, because this here commands the website at hand to have the picture scroll with you, and not be left behind, cause it is 'fixed' in place, it will follow you around, much like that little doggy you love most :3
}
~~And here is your closing brackett to close the nest of code, congratulations, you have written your first piece of css code, a background that scrolls with you. Now that was the hardest one in this piece of code, though it was pretty easy right?
 
~~Next, is our next block of coding, this takes your text and turns it into what you want. By the use of the "span" you can change the font to whatever you feel, it took me a bit of researching the code of the website to figure this little bit out :P
 
span
~~Your text code, kinda like a
if you know html, only nestled into a different piece of code like a
, its more appropriate to use, but many people still use
, which is the paragraph command.
{
~~Opening brackett.
color:#B00000;
~~This is pretty easy to understand, changes the color of your font, ezpz right? but you're asking me why its a number instead of the actual color correct? Well with that, its called a hexdecimal, this adds different pigments and light to your color, creating different colors, such as #000000 is black and #FFFFFF is white, #B00000 is a dark crimson red, you add a bit of light and red (B) into black, and you get a nice crimson, blood red.
font-family:"comic sans ms";
~~This just changes the font, such as I have comic sans ms, though when you have more than one word in your description, you have to put it in quotes "", to make it readable by the browser, or it will not work. Though I didnt explain this earlier, when you are putting 2 words in the command line (font-family:) you have to put a dash between the two words, its kinda weird like that. But as for your font family, its just to change the font, you can put different fonts on there, font-family:"comic sans ms",arial,"sans serif";.
font-size:15px;
~~This changes the size of the font at hand, in this case, its the basic lettering of your website, font-size, pretty self explanitory, 15px, whats that? That is just saying how many pixels you want in your lettering, in this case, 15 pixels, pixels is just shortened down to px to be quicker.
}
~~And your closing brackett.
 
~~Here is your headers, h1 is the largest, all the way down to the smallest header, h6, h1~h3 are used most often for headers as they stand out better in large amounts of text.
h1,h2,h3,h4,h5,h6
~~You can group different types of data in the same family, such as headers, together to save time instead of writing it block after block.
{
~~Opening brackett.
color:#7FFF00;
~~This changes the color of your font to a nice lime green, you have the seven in the front which really, I'm not sure what that is anymore, the amount of green I believe in the spectrum. If you're interested to know more about the color values and their spectrum numbers you'll probably need to look eleswhere :P
}
~~Closing brackett.
 
~~Now for some fun stuff, links, you can do all kindsa stuff with these :D
 
a:link
~~This command is just your basic link, how it looks when its just there, to look at, nothing touching the link, its just there to be pretty. ()
{
~~Opening brackett.
color:#00FF00;
~~Changes the color to a bright yellow, simple really. Ill post a website with alot of the hexdecimal color values at the end of the tuturial.
font-family:Trebuchet;
~~Your basic font changer, this was explained earlier in the tutorial.
font-size:15px;
~~Changes your font size to a 15 pixel font.
}
~~Closing brackett.
 
~~Visited link, this is one you have already clicked on, and will most likely be greeeeennnn :D
 
a:visited
~~As it states, a visited link, or a link you have previously hovered over and clicked on to see the contents of what is inside said link... maybe porn?
{
~~Opening brackett.
color:#FFFF00;
~~This is a nice green as well, though darker than the one I previously posted.
font-family:Trebuchet;
~~Changes your font to trebuchet, a nice, cleaner font to where links are easy to read right off.
font-size:15px;
~~Your font size, I used the same font size for all these links types, though it didnt seem to work well for the hover. :\
}
~~Closing brackett.
 
~~We're almost finished here, just one last block, and you will have a finished profile!
 
a:hover
~~This here is for when you take your mouse and hover over a link, it will change it according to the block of code in the nest below.
{
~~Opening brackett.
text-decoration:underline;
~~This 'decorates' the font, giving it an underline when hovered over, there are different types of decorations, you have strike through, oblique, bold, italics, and other types. They can be used to your disgression :) 
font-family:"segoe print";
~~With this, I wanted to change the font of the link when hovered over, with this little guy, I can do just that, this changes the font from a nice clean trebuchet, to a comical segoe print, its pretty fun :D
color:#FF4500;
~~A dark orange color, when hovered over, the link changes from a bright yellow to a dark orange, which gives a little flair to your website/profile.
}
~~Closing brackett.
///////////////////////////////////////////////////////////////////////////////////////////////////////
And you're done! Finished with the profile edits, pretty simple eh? Once you get all the commands down and everything planned out, it all comes into place. You can put this with html coding for websites, and you can just be a site editor, or you could be a full blown artist with your keyboard, whatever. Just have fun with it. :)
 
For more information on css, java, html, xml, and different types of coding, you can learn at http://w3schools.com.
For color hexdecimals and color sheets go here: http://w3schools.com/css/css_colornames.asp
Hope you enjoyed and thanks for readin. :3
 
~Shortpaw