"How do I change my comment input background?"

commentInput {

background-image: url(URL HERE);

}

Of course, you may replace background-image with the color component instead. One thing I forgot to mention until now is linear gradients. Linear gradients seem hard to code, but they are actually easy. Here is an example of a comment input with a linear gradient background instead:

commentInput {

background-image: linear-gradient(to right, black , darkred);

}

This link will teach you more about linear gradients and how to use them in replacement of an image, gif, or regular color: https://www.w3schools.com/cssref/func_linear-gradient.asp ... Linear gradients can be used in place of any URL or color (if it is a background/background-image component).

"How did you get a custom cursor?"

I actually used a website for the cursor and code. This site offers animated or still cursors, and it is from a variety of media (anime, celebrities, holidays, etc). Use the MySpace 2.0 coding and put it into your CSS rules: https://www.cursors-4u.com/

"How did you get the L gif on your sidebar?"

.topLeft::after {
content: "(URL HERE)";
display: block;
position: 50% 50%;
height: (IMAGE/GIF HEIGHT)px;
max-width: (IMAGE/GIF WIDTH)px;
background-position: 0 0;
background-size: 100% 100%;
background-image: url(URL HERE);
object-fit: cover;
}

This code block has a LOT of components to it, so it is significantly harder to understand. I recommend using these dimensions and adjusting for your image. If you have a smaller image/gif, doubling the height and width is a quick fix to making it bigger. I recommend setting object-fit to cover so that your image doesn't become warped or stretched. object-fit and background-position is very hard to explain, but this article is a quick read, simple to understand, and includes code as well as pictures of the code in action. https://css-tricks.com/on-object-fit-and-object-position/ I recommend playing around with the settings for a while and understanding how these variables work.

"How did you put extra text in the header?"

.logo b:(before or after) {
content: "BLANK";
font-family: (Arial, Tahoma, etc); (CSS friendly families: https://www.w3schools.com/cssref/css_websafe_fonts.asp)
font-size: (number)px;
color: (color hex, code, or rgb); (Font color)
}

DISCLAIMER: I am not aware currently how to hide the MySpace logo. However, I will edit this blog when I do. If you check my profile, you will see my header says "gundham tanaka lover". I put this into the BLANK in the content section. If you don't have the MySpace logo already hidden, I suggest you use before and not after. If you do have it removed, the 'after' variable will place this text where the logo used to be.

"How do I change the Send Message, Add to fwiends, etc icons?"

Send Message Icon:

sMsg {

background-repeat: no-repeat;
background-image: url(URL HERE);

}
Add to fwiends Icon:

add {

background-repeat: no-repeat;
background-image: url(URL HERE);

}
Report Icon:

report {

background-repeat: no-repeat;
background-image: url(URL HERE);

}
Block Icon:

block {

background-repeat: no-repeat;
background-image: url(URL HERE);

}
Changing The Font Color of These:
.boxButton {
display: inline-block;
width: calc( 49% - 60px );
padding-left: 30px;
height: 24px;
font-size: small;
color: (color code, hex, or rgb);
padding-top: 7px;
}

The #(name) component is different for all of these, so make sure you include all of these code blocks if you want to change them all. For the font color/boxButton block, you can mess around with any of the variables to your desired effect.

For now, this is everything I know about basic CSS. Besides CSS, other advice I have is choosing easily readable colors appropriate for your background, blurb color, etc. Will edit when I learn more.

Hello! I am going to forego any typing quirks for this blog. This blog will include websites, code, etc. to make you more knowledgeable on CSS and also give you a prettier blog (hopefully). Most of this blog is gonna just be the raw code with some pointers and advice.
If you want to become self-proficient in CSS, I recommend watching the CSS tutorial provided by Tom (linked at the bottom of your edit profile page) and becoming comfortable using Inspect Element on people's profile.
In case you don't know: TO MAKE THIS CODE WORK, go to your profile editing page and insert this code into the CSS portion at the bottom.

"How do I change my MySpace background?"

body{
background-image: url(URL HERE)
}

When you use this code, make sure you keep the parentheses and the brackets. Your URL can either be a gif or a still image. If you want a color and not an image, putting "background-color:" instead of "background-image:" works too, I believe! Put in a valid CSS color code, hex code, or RGB values instead of a URL. Here is a link to valid CSS color codes with reference: https://www.w3.org/wiki/CSS/Properties/color/keywords

"How do I change the font colors?"

Main Body Colors:
body{
color: (color code, hex, or rgb)
}

Hyperlink Colors:
a:-webkit-any-link {
color: (color code, hex, or rgb);
cursor: pointer;
}
Fwiend Count Colors:
.fwiendCount {
color: (color code, hex, or rgb);
}

It is important you use BOTH of these codes or else your page will have purple/blue font defaulted on your hyperlinks. By the way, when you put in all this code, make sure a BRACKET separates each line. Brackets are this symbol: }} However, if you are putting in the code in order of this tutorial, you should have no problem (I always include a separator bracket at the bottom of the copy-paste codes).

"How do I change the blue MySpace header?"

Header:
div#header {
background-image: url(URL);
text-align: (left, center, or right);
}
Subheader:
div#hSub {
background: (color hex, code, or rgb);
color: darkred; (This is the color of the dividers between the buttons.)
text-align: (left, center, or right);
}

Remember, background-image can be replaced with background-color instead. For the subheader, background can be replaced with background-image.

"How do I put color behind my about me/blurbs?"

.box {
border: (solid, double, dotted, dashed, ridge, groove, inset, outset, none, or hidden) (color hex) (number)px;
overflow: hidden;
background: (color hex, code, or rgb);
}

Boxes are a part of CSS with a few resources. I will link a site that shows each border and how to do rounded borders. Remember, background can be replaced with background-image. For the number value, I recommend 4-8px. It shows up the best. Here is the link (this site also has other easy CSS tutorials): https://www.w3schools.com/css/css_border.asp

"How do I change the header backgrounds?"

Contacting Header:
.boxHead {
background: (color hex, code, or rgb);
color: (color hex, code, or rgb); (This is the text color).
padding: 3px;
padding-bottom: 4px;
padding-left: 6px;
}
Fwiends Space and Blurbs Header:
.rightHead {
background: (color hex, code, or rgb);
color: (color hex, code, or rgb); (This is the text color).
}

In case you are confused what these are, this is the color behind the subheaders-- e.g, on my profile the headers that say "gundham's gf's Fwiends Space". These are what these code blocks are controlling. Reminder that background can be replaced with background-image. If desired, you may change the pixel values in the Contacting Header. The most important part of CSS is playing around to see how different components work. By doing this, you will become more familiar with reoccurring components.

I HAVE TO SPLIT THIS BLOG IN TWO!! LOOK FOR PART 2 ON MY RECENT BLOGS

hi guyz! i have been seeing different profiles have pictures in the bottom left/right corners (usually gifs) and ztuff. i have tried going to inzpect element and copying over into my css, but it doezn't work for some reason. i think thiz iz becauze my url box that i have won't go away.
does anyone know how 2 get this to work? i've tried. (linking profiles with the URL box picturez):
https://myspace.windows93.net/index.php?id=51941
https://myspace.windows93.net/?id=53996

i've alzo tried going 2 github to get the coding and changing the link for my gif, but it doesn't work.