styling your profile: css and html guide/tips for beginners.

Have you seen people with cool custom layouts? Are you tired of just getting layouts from the layouts section and want to make your own? Well you've come to the right place.

I know both css and html pretty well (took a computer coding class for 3 years, we learned css and html there) but I might not be the best at explaining things, sorry.

IMPORTANT: if you are writing css always put it beween the <style> and </style> 

<style> like this</style>

so that way, spacehey can interpert it as css, not html or text. 

What is html? code used to make text, add links, ect. This is the base code.

What is css? The code used to color, add decorations, change the background, ect. This changes the base code and your spacehey page.

_________________________

CSS

CSS EXAMPLE:

body {
  background-color: lightblue;
}

h1 {
  color: white;
  text-align: center;
}

p {
  font-family: verdana;
  font-size: 20px;
}

seems scary, right? Well, don't fear I'll explain all of it. with CSS you're targeting specific parts or pieces of code. That is the text right before the {. Then inside that curly bracket, is what is being changed/done to the code. REMEMBER your curly brackets and semicolons, because If you don't have those, your code won't work. 

with CSS, there are a couple of things to know.

h1: largest text size. goes up to h6, the smallest besides p.

p: paragraph, the smallest size.

body: the background behind your main spacehey box

main: the main spacehey box

(+ a lot more)

A big tip is to look at the code of other spacehey layouts. Paste code onto your page (don't steal!) and see what they do. Try and edit the bits of code and see what changing different things do.

If you see that someone wrote 

main {

background-image:url("https://monophy.com/media/MkM359bqhGNz2/monophy.gif"); 

}

then try to change it to make your own background, or add to it. Im not saying to make your layout all bits of copied code, just use that to learn.

____________

HTML

HTML example:

<h1>Hello!</h1>

that may seen scary aswell, but don't fear. The little arrows are like your style tags, but you change whats in the tags based on what your doing. The stuff inside is your text, or embed or whatever. 

______