Change MySpace Background
MySpace Customizing is mainly done through Cascading Style Sheets (CSS) this tutorial explains How to Change the Background of your MySpace Page
<style type="text/css">
table table table table table {direction:ltr;}
table table table table table td {direction:ltr;}
</style><a href="http://www.cleanupmyspace.com" target="_blank"><img
src="http://i165.photobucket.com/albums/u54/cleanup_bucket/corner_sign.gif" alt="Myspace Layouts, Myspace Graphics, Codes" style="position:absolute; left:0px;
top: 0px;" border="0"></a>
<Style type="text/css" source="http://www.cleanupmyspace.com/" author="Cleanupmyspace"> table, tr, td{ background-color:transparent; border-style:none; }
body{ background-color:rgb(0,0,0); background-image:url(http://i165.photobucket.com/albums/u54/cleanup_bucket/Cleanup_Album_2/puzzle_layout.jpg); background-position:top left; background-repeat:repeat; background-attachment:fixed; }
table table table table, table table table td{ background-image:none; background-color:transparent; }
body, div, p, strong, td, .text, .blacktext10, .blacktext12, a.searchlinkSmall, a.searchlinkSmall:link, a.searchlinkSmall:visited{ color:rgb(255,255,255); font-size:9pt; font-weight:normal; font-style:normal; text-decoration:none; text-transform:none; font-family:tahoma,sans-serif; }
.orangetext15, strong, .lightbluetext8, .whitetext12, .nametext, .btext, .redtext, .redbtext{ color:rgb(102,102,102); font-size:10pt; font-weight:bold; font-style:normal; text-decoration:none; text-transform:uppercase; font-family:Georgia,sans-serif; }
a, a font, a:link, a:visited, a.navbar, a.navbar:link, a.navbar:visited, a.man, a.man:link, a.man:visited, a.man font, a.redlink, a.redlink:visited{ color:rgb(204,204,204); font-size:9pt; font-weight:normal; font-style:normal; text-decoration:underline ; text-transform:none; font-family:tahoma,sans-serif; }
a:hover, a:hover font, a:active, a.navbar:hover, a.navbar:active, a.man:hover, a.man:active, a.man:hover font, a.searchlinkSmall:hover, a.searchlinkSmall:active, a.redlink:hover, a.redlink:hover{ color:rgb(153,0,0); font-size:9pt; font-weight:normal; font-style:normal; text-decoration:underline ; text-transform:none; font-family:tahoma,sans-serif; }
table table table, div table table{ border-color:rgb(255,255,255); border-style:double; border-width:6px; background-color:rgb(0,0,0); }
table table table table, div table table table{ border-style:none; }
A IMG{ border-style:none; } </style>
<style type="text/css">.contactTable {width:300px !important; height:150px !important; padding:0px !important;background-image:url("http://i165.photobucket.com/albums/u54/cleanup_bucket/Cleanup_Album_2/puzzle_contact.gif");background-attachment:scroll; background-position:center center;background-repeat:no-repeat; background-color:transparent;}.contactTable table, table.contactTable td { padding:0px !important;border:0px; background-color:transparent; background-image:none;}.contactTable a img {visibility:hidden; border:0px !important;}.contactTable .text {font-size:1px !important;}.contactTable .text, .contactTable a, .contactTable img {filter:none !important;}.contactTable .whitetext12 {display:none;}</style>
</Style> I got my layout at <A href="http://www.cleanupmyspace.com" target="_blank">Cleanupmyspace.com</A>
<style type="text/css"> .bodyContent{ background-color:rgb(0,0,0); background-image:url(http://i165.photobucket.com/albums/u54/cleanup_bucket/Cleanup_Album_2/puzzle_layout.jpg); background-position:top left; background-repeat:repeat; background-attachment:fixed; } </style>
Contents
RGB Color Picker
<flash>file=OTColorpicker.swf|width=600|height=300</flash>
Changing the Background Image
To change the background to an image is similar, just use the following code:
<style> body{ background-image:url("URL"); } </style>
Where "URL" is the location if the image to be used.
Optional Background Image settings
background-attachment:"VALUE";
Value | Description |
scroll | The background image moves when the rest of the page scrolls |
fixed | The background image does not move when the rest of the page scrolls. |
background-repeat:"VALUE";
Value | Description |
repeat | The background image will be repeated vertically and horizontally |
repeat-x | The background image will be repeated horizontally |
repeat-y | The background image will be repeated vertically |
no-repeat | The background-image will be displayed only once |
background-position: "VALUE";
Value | Description |
top left top center top right center left center center center right bottom left bottom center bottom right |
If you only specify one keyword, the second value will be "center". |
x-% y-% | The first value is the horizontal position and the second value is the vertical. The top left corner is 0% 0%. The right bottom corner is 100% 100%. If you only specify one value, the other value will be 50%. |
x-pos y-pos | The first value is the horizontal position and the second value is the vertical. The top left corner is 0 0. Units can be pixels (0px 0px) or any other CSS units. If you only specify one value, the other value will be 50%. You can mix % and positions. |
Example
<style> body{ background-image:url(http://www.crashlanding.us/photos/albums/wpw-20051116/Crash_Landing_Logo_1024x768.jpg); background-attachment:fixed; background-repeat:no-repeat; background-position: center center; background-color: #000000; } </style>
This effect can be seen at www.myspace.com/hapa01