HTML/CSS for Myspace Documentation
From Wikiid
Revision as of 20:15, 23 October 2007 by SteveBaker (Talk | contribs) (New page: Especially Oliver... In this there will be examples and safe versions of code for my myspace ===Div backgrounds for bulletins and such=== For adding backgrounds for bulletins, with backgr...)
Especially Oliver... In this there will be examples and safe versions of code for my myspace
Contents
Div backgrounds for bulletins and such
For adding backgrounds for bulletins, with background tables in bulletins, and a safe copy of a simple comment box:
<body style="background-image: (urlhttp://i47.photobucket.com/albums/f188/Roeangeleyes1979/background.jpg);">
<div style="background-image: url(urlhttp://i47.photobucket.com/albums/f188/Roeangeleyes1979/background.jpg); margin:20px;padding:20px;">
<center>
<div style="border:1px solid black;background-color:white;padding:1px;width:478px;">
<h2>
Hey,My name is Miranda Jade Hickey
Hickey, yes hickey<br>
spelt the same as the one on your neck<br>
I'm 14, 15 on february 24th.<br>
I'm czechlosivocian (it's exotic..lol), pennsylvania <br>Dutch, Irish(alot!!) and Yurok.<br>
Fun people that make me laugh<br>
I hate moths<br>they bug me<br>
SARAH= best friend!<br>
KALLI= best friend.. <br>
I'm selfish, I pretty much think about my self before every one else<br>and i take the best before someone else<br>yea, pretty much<br>i have my super nice sharing moments tho..<br>
ice cream mmmm...<br>I Belive im a serious ninja<br>
I have an oustanding love for robots<br>i have yet to master the dance at best<br>I'm a dancer not a fighter<br>i play aggressive name calling<br>yes be affraid..<br>butthole faced vagina!<br>ii don't know
I'm very exciting to be around <br>
I'm also very boucy<br>
<b>RANDOM</b><br>
<br>
I love the creator of socks<br>
He or she hid the ugly things the world created..feet!<br>
Pretty much<br>
friends!!!!!<br>
<br><br>
I like to mud slide<br>..and create sick dance moves and words..<br>I am single, yes..<br>add me i'm cool<br>
MONSTERS!!!!
roxxi's definition of miranda=RANDOM!crunked out gangstahh she is all over the place and it takes a real person to follow her! somtimes when she talks all u have to do is nod and agree. she never talks about one thing at a time. she loves socks. she think pete wentz is shexay she thinks emos are hawt. them and there bonerlicios emo flips and tight pants..psst she likes bulges. very purrty and has a emo___. socks are better than diamonds!! agrees guys are fuckin loser faces.woo the end.
sarahs' definition
<br>-Mir<br> -random <br>-pointless <br>-has kickass breakdancing moves<br> -helped me find one of my greatest loves..rock <br>-mir is amazing and never fails to make me crack a smile<br>..BONE! <br>
<a href="http://photobucket.com" target="_blank"><img src="http://i126.photobucket.com/albums/p84/xsana01x/44qo7zk.gif" border="0" alt="Photo Sharing and Video Hosting at Photobucket"></a>Add me<br> randa_roo_rooster@hotmail.com
</h2>
</div>
Comment Box
<center>
<form method="post" action="http://comments.myspace.com/index.cfm?fuseaction=user.ConfirmComment"
"return lengthCheck(this);">
<input type="hidden" name="friendID" value="64864434">
<input type=hidden name=Mytoken value=20041116012729>
<textarea id="textarea" name="f_comments" cols="50" rows="10"></textarea>
<br><br>
<input id="buttons" type="submit" value="Post">
<input id="buttonr" type="reset" value="Reset">
</form>
</center>
Image Maps
My pride and joy
<map name="ContactTable"> <area shape="poly" coords="153,263,127,169,126,50,138,31,164,29,175,48,177,75,186,124,194,171,208,222,205,230,191,256" alt="Send Message" href="http://messaging.myspace.com/index.cfm?fuseaction=mail.message&friendID=64864434"/> <area shape="poly" coords="214,0,205,60,206,152,214,220,247,235,273,224,266,83,260,7,254,0,253,0" alt="Forward Me" href="http://mail.myspace.com/index.cfm?fuseaction=mail.forward&friendID=64864434&f=forwardprofile"/> <area shape="poly" coords="292,10,313,9,327,20,330,242,293,251,274,223,272,172,277,24" alt="Rank Me" href="http://collect.myspace.com/index.cfm?fuseaction=RateImage.UserRating&UserID=64864434"/> <area shape="poly" coords="421,76,402,79,393,91,340,243,358,282,394,291,430,158,437,95,430,84" alt="Block Me" href="http://www.myspace.com/index.cfm?fuseaction=block.blockUser&userID=64864434&hash=MIGvBgorBgEEAYI3WAOHoIGgMIGdBgorBgEEAYI3WAMBoIGOMIGLAgMCAAECAmYDAgIAwAQIkfxfO%2f9sFEAEENV95DzWEgInY1FnKWes3jYEYIAU0diDU3YPosuAcyIDibSe2%2fTcACXLx31HfWpo6JRotcDTxHtkshzBijtAp8TAEB6Hge36naChxtMu500ACuQUzEa3iRXUo721QPQogtk6364fYDOFa1avghELhnAN2Q%3d%3d"/> <area shape="poly" coords="140,337,119,327,96,298,38,278,6,290,1,310,41,344,93,420,153,488,158,393" alt="Add To Group" href="http://groups.myspace.com/index.cfm?fuseaction=groups.addtogroup&friendID=64864434"/> </map> <img height="512" width="435" border="0" usemap="ContactTable" alt="Rock*Star" title="Contact RockStar" src="http://i53.photobucket.com/albums/g47/rockstar_oliver/hand_contact.jpg"/>
Floating images
Absolute location (position: absolute;) for images is recommended, but relative can also be used.
<style type="text/css">
.classname {
position: absolute;
}
</style
<img src="url of image" class="classname">
Sample layout
Sample layout from "Myspacelayouts.US"
<div id="msl"><style type=text/css>
body {
background: FFFFFF url("http://images.xangsters.com/myspace/14/3329.jpg");
background-position: bottom right;
background-repeat: no-repeat;
background-attachment: fixed;
scrollbar-arrow-color:000000;
scrollbar-track-color: FFFFFF;
scrollbar-shadow-color: EEA4DF;
scrollbar-face-color: C17CCD;
scrollbar-highlight-color:C17CCD;
scrollbar-darkshadow-color:EEA4DF;
scrollbar-3dlight-color:C17CCD;}
table, tr, td {background-color: transparent; border: 0px; padding:2;}
table table {border: 0px;}
table table table table{border: 0px;}
/*The actual modules*/
table table table {border: 1px solid; border-color: 8253AF; background-color: EEA4DF; }
/*sets the default style for the body, table data, list data, divisions and text areas*/
body,table, td, li, p, div, textarea
{font:normal 10px batang; color:8253AF; font-weight:none; border:0px; text-transform: none; line-height:12px;}
/*class for the basic font for the page*/
.text {font:normal 10px batang; color:8253AF; font-weight:none; border:0px; text-transform: none; line-height:12px;}
/*style for the number of comments you have. The actual ..*/
.redtext{font-family:batang; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase; }
/*style for the number of friends you have.*/
.redbtext{font-family:batang; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase; }
/*”Blurbs”, “About Me”, “Who I’d like to Meet”, “Friend Space”, and “Friend’s Comments” style*/
.orangetext15{font-family: batang; color: 8253AF; font-weight: bold; font-size: 15px; letter-spacing: 0px;}
/*”General”, “Music”, “Movies”, “Television”, “Books”, “Heros”, “Status”, “Here for”, “Hometown”, “Body Type”, “Ethnicity”, “Religion”, “Sign”, “Smoke/Drink”, “Children”, “Education”, “Occupation”, and “Income” title style*/
.lightbluetext8{font-family:batang; font-size:10px; color:8253AF; font-weight:none;border:0px; text-transform: uppercase; }
/*”Contacting”, “Interests”, “Details”, and “Schools” title styling*/
.whitetext12{font-family:batang; font-size:10px; color:8253AF; font-weight:none;border:0px; text-transform: uppercase;}
/*”In your extended network” style*/
.blacktext12{font-family: batang; color: 8253AF; font-weight: bold; font-size: 20px; letter-spacing: -2px; }
/*Stylizing of your name above your picture */
.nametext{font-family: batang; color: FFFFFF; font-weight: bold; font-size: 30px; letter-spacing: -2px; line-height: 35px;}
/*date stamp on comments*/
.blacktext10{font-family:arial; font-size:9px; color:............; font-weight:none;border:0px; text-transform: uppercase;}
/*This is how all anchor points will be displayed; anchor points appear before all links.*/
a{font-family:batang; font-size:9px; color:8253AF; font-weight:none;border:0px; text-transform: uppercase; }
a:link{font-family:batang; font-size:9px; color:8253AF; font-weight:none;border:0px; text-transform: uppercase;}
a:active{font-family:batang; font-size:9px; color:8253AF; font-weight:none;border:0px; text-transform: uppercase;}
a:visited{font-family:batang; font-size:9px; color:8253AF; font-weight:none;border:0px; text-transform: uppercase;}
a:hover{font-family:batang; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
/*”View all friends” and “invite more” link style*/
a.redlink{font-family:batang; font-size:9px; color:8253AF; font-weight:none;border:0px; text-transform: uppercase;}
a.redlink:link{font-family:batang; font-size:9px; color:8253AF; font-weight:none;border:0px; text-transform: uppercase;}
a.redlink:active{font-family:batang; font-size:9px; color:8253AF; font-weight:none;border:0px; text-transform: uppercase;}
a.redlink:visited{font-family:batang; font-size:9px; color:8253AF; font-weight:none;border:0px; text-transform: uppercase; }
a.redlink:hover{font-family:batang; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
/*2 links in very top on the left, and the 13 links above your picture with make the navigation bar*/
a.navbar{font-family:batang; font-size:9px; color:8253AF; font-weight:none;border:0px; text-transform: uppercase;}
a.navbar:link{font-family:batang; font-size:9px; color:8253AF; font-weight:none;border:0px; text-transform: uppercase;}
a.navbar:active{font-family:batang; font-size:9px; color:8253AF; font-weight:none;border:0px; text-transform: uppercase;}
a.navbar:visited{font-family:batang; font-size:9px; color:8253AF; font-weight:none;border:0px; text-transform: uppercase;}
a.navbar:hover{font-family:batang; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
/*Default Links*/
a:link, a.man{font-family:batang; font-size:9px; color:8253AF; font-weight:none;border:0px; text-transform: uppercase; letter-spacing: 0px;}
a:active{font-family:batang; font-size:9px; color:8253AF; font-weight:none;border:0px; text-transform: uppercase;}
a:visited{font-family:batang; font-size:9px; color:8253AF; font-weight:none;border:0px; text-transform: uppercase;}
a:hover{font-family:batang; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
/*bolded words*/
.standard b, p b, B, strong {
font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase; }
</style><br /><a href="http://www.myspacelayouts.us" style="font-size:12px;text-decoration:underline;line-height:30px">MySpace Layouts</a></div><br/>
