(copy and pasted from helio's comment) I whipped this up last night. Please let me know if it's useful or how I can improve it.
I hope that this can be a guide to basic ____ coding...
I haven't been able to find any kind of precedent for this work, across Wikia, or anywhere else for that matter, so it might be good to have a guide if anyone would like to learn how to incorporate some html into their pages.
HTML Tags[]
Wikia is html supported, and a lot of times you don't even realize that it's using html tags. if you bold a word, for instance, your ''' is automatically translated into a <b> tag or a font-weight property.
There are 3 basic types of tags, Wikitext exempted, and they are the <div>, the <p>, and the <span>. Understanding how to use these are a vital first step in coding a page.
span[]
Span is the simplest and most frequent type of tag. I like to look at the s and associate span with sentence. The span tag is good for short coding effects. If you would like to highlight a couple words in a sentence, span can come in handy.
For Example;
If you would like to highlight <span style="background:yellow;">a couple words</span> in a sentence, span can come in handy.
results in
If you would like to highlight a couple words in a sentence, span can come in handy.
span is most frequently used to add effects to text. It can use such properties as color(font color), font-size, background(for highlighting), and all sorts of other bits that can make individual few words stick out.
p[]
P is for paragraph, or at least that's how I like to see it. I don't personally use p tags very often, but it can come in handy if you want to edit the text in a whole paragraph. You can use any property in p that you can use in span, and if you want to highlight a whole paragraph of text, you would use p instead of span.
div[]
Div statements are special because they focus on a region of the page rather than the text. If you see a box around a section on a page, chances are that it uses a div statement. Although p paragraphs can use any property that div sections can, if you want to format an area that is more than just a single paragraph, you must use div.
Syntax[]
Now that you know what the tags look like, you need to know how to use them.
In order to see the coding in your page, you must edit your page in "source mode". If you use the Visual Editor, you may want to switch your Default editor to the Rich Text Editor in [ your preferences] or edit it with the Classic Editor with the drop-down arrow by the edit button.
It might be best to show an example of some code first, so you can get an idea for the syntax.
<div style="background:black; border:1px solid black; color:white;"> <p style="font-size:16px;">Personality</p> Korathius is a nice dragon and always loves to hang out with his friends. Even though he is a NightWing, he has many RainWing friends, and they call him their <span style="color:purple;">purple pal</span>. He loves to play and doesn't let the world bother him, although he can't help but feel a little lonely. </div>
results in
Personality
Korathius is a nice dragon and always loves to hang out with his friends. Even though he is a NightWing, he has many RainWing friends, and they call him their purple pal. He loves to play and doesn't let the world bother him, although he can't help but feel a little lonely.
Notice a few things.
In each of these tags, you use a style statement. You need to type your tag statement and then style="", separating each parameter with a semi-colon(;).
Also notice that each tag you start needs to be closed. you start your <div> tag at the top, and a </div> closes it. It is essentail that you close all of your tags, or there can be serious coding mess. (div is closed with /div, p is closed with /p, span is closed with /span. It's the same pattern for other tags too.)
Parameters[]
I hope to expand this later, but there are some common things that will come up. color changes the text color; font-size is self explanatory, but make sure to express your number in px; background gives a color (or pattern) to a section; border is expressed with a syntax of border:(border-width) (border-style) (border-color);