Myspace Background Codes Tutorial

The following background code removes of all the default table styling which enables the table background to become transparent.

<style type="text/css">

table, td {
background-color:transparent;
border:none;
border-width:0;}
</style>

To change the color of your background enter the six digit color code:

The background-color property lets you change the background color for your page. For example to set a background color for your page, you would use something like this where color_code would be the six digit color code:

<style type="text/css">

body
{background-color: color_code;} // Color Code Chart

</style>

 

Set a picture as the fixed background of your page:

The background-image property can be used to specify a background image your page. For example, to set a background image for your page, you would use something like this where image_url would be the url of the image you would like to use for your background:

note: using the "background-attachment: fixed" property makes it possible for the background to stay fixed in the same place on the screen while the page scrolls:

<style type="text/css">

body{background-image:url("image_url");
background-attachment:fixed;}

</style>

More background properties:
Just add these properties between the existing <style> </style> tags:
Specifying how the background image tiles:

background-repeat: repeat
Default setting. Tiles the background image both horizontally and vertically.

background-repeat: repeat-x

Tiles the background image in the horizontal direction only. Use if you want the background running across the top of the page.

background-repeat: repeat-y
Tiles the background image in the vertical direction only. Use for left-hand page borders.

background-repeat: no-repeat
No repeating takes place. This displays only one copy of the image. Use if you want to use a large image that isn't designed to tile.

Positioning the background image

background-position: x% y%
Places the image x% across the page and y% down the page. Values of "0 0" indicate the top left hand corner.

background-position: x y
Places the image x units across the page and y units down the page. For example, "60px 35px" places the image 60 pixels to the right of the top left corner, and 35 pixels below it. You can use any CSS units to specify the position.

background-position: <position>
Positions the image using one of various positioning words. These are: top left, top center, top right, center left, center center, center right, bottom left, bottom center and bottom right.

Here's an example that results in a centered picture that will repeat vertically, with a blue background:

<style type="text/css">

table, td {
background-color:transparent;
border:none;
border-width:0;}

body {
background-color: #3300FF;
background-image: url('image_url');
background-repeat: repeat-y;
background-position: center;}

</style>