Difference between revisions of "Change MySpace Background"
(→Changing the Color) |
|||
Line 2: | Line 2: | ||
− | === | + | <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> | ||
=== RGB Color Picker === | === RGB Color Picker === |
Revision as of 07:11, 20 June 2008
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