User blog:DisneyLover16/How to Get the "Freaky Font"

Heyo! :) So, I hear that you need help with that font-y stuff? Well, this should probably help. So, I made this blog for reference. :) ...And so that I nor anyone else doesn't have to explain the same thing to multiple people multiple times. x) I also don't feel like doing homework right  now, so heh. :P

But anyways, in order to get this font, there's a certain format to go by, best in source mode. (You could do this on mobile devices too, but you won't be able to see the font when it's posted. *shrugs*) And, also, you could always copy and paste the other fonts other people post, but this is more for if you want to create your own font. :]

There are 4 different components, or parts, that are used in it.
 * Color
 * Size
 * Font-Family/Style
 * Text Shadow

The Format
(I'm going to use this specific text as the example):

This is the format you would use.

The only thing about that above example is that there is no underscore (this thing -> _ ) between span and style. There is a space in between the two words.

' Note: Keep in mind that throughout this blog, I'm going to use the underscore for examples, but make sure you don't use it, yourself. :) '

Color
The basic format of using only color in your text is this:

Insert the text here.

So you see that code with the "hashtag" or the "number sign" right after "color:"? That's the part that determines what color you want the text to be.

For me, I use this webpage to help me choose whatever color you want.

[http://html-color-codes.com/ This is the link to that webpage. Click this, and it'll show a bunch of different color codings to put into the format.]

If you choose, you can use basic color names such as red, green, pink, yellow, etc, and not have to put the code in there. But, if you want more creative colors, you'll probably want the coding.

Size
The format of using only size in your text:

Insert the text here.

This part "20px" determines how big or small the text is.

It occurs to me that this is probably the easiest part of the formating. :P You just have to test out different numbers to find how big or small you want the text. The text you're reading at the moment is 20px.

This text is 10px.

This text is 30px.

Font-Family/Style
This is slightly more complicated and/or difficult, especially if you don't know font names. Because, that's all that basically is.

The format of using only font-family/style:

Insert the text here.

Yeah, so the name of the font is what changes what the text actually looks like. Examples of different font are arial (the one you're reading), segoe print (the one used in the text that's in pink and blue), times new roman, ravie, stencil, etc. You can go into Microsoft Word to find different font names.

Text Shadow
Unforunately, this is the hardest part of formating the text. :/ Well, maybe it won't be too bad... :)

Anyways, the format of only the shadow:

Insert the text here.

Okay, so this part "5px 0px 5px" determines where the shadow is placed horizontally, where the shadow is placed vertically, and how "blurry" the shadow is. It goes in that specific order too.

The first px value is where it's placed horizontally.

The second px value is where it's placed vertically.

The third px value indicates the "bluriness".

Basically, you just have to experiment with it, to find what you want. And, you can always put a negative sign in front of the number for the first two px values.

Putting a negative sign in front of the first px value places the shadow to the left. Putting a negative sign in front of the second px value places the shadow upwards.

Oh! And by the way, the coding is what color you want the shadow be. ...I think you might have figured that already, and there's no need for me to explain that again. It works the same way as it does with putting in color for text. Just refer to the above format. :)

Multiple Shadows
The only thing with multiple shadows is that you can use as many as you want (for me, it looks cool if all is used either going upwards :]) and that each shadow has to be separated by commas.

Example:

Insert the text here.

Putting It All Together
Not as complicated as you might think it to be.You just have to separate each component or part by semi-colons.

The overall format just like I mentioned initially:

Insert the text here.

Now children. EXPERIMENT. :] :D Feel free to do whatever you'd like to test out in the comments or whatever page on the wiki. And, feel free to ask me any questions if you must, as well as anyone else who seems to know what they're doing. :)

...Hopefully, I explained this well enough. x) If not, then... #Fail :P