Notice: I'm considerring deleteing this tutorial and making one specifically for CSS so that I'm not so restrained. Just thought you should know.
Note: Before you even think about editing your UberStyle, you must have at least a moderate understanding of HTML
Note: The newest updates will be monospaced
The Backgrounds this can be used the change the backgrounds of any element, not just the main background. Background-color: Use a color as explained previously. Background-image: Syntax: { background-image: url(http://url) } always remember to include the http:// Background-repeat: Use either repeat-x, repeat-y, repeat (which repeats on both axes), or no-repeat. Background-attachment: Either scroll or fixed. If it's fixed the background doesn't move, if it's scroll it does. Background-position: Any combination of top, center, or bottom with left, center, and right. I.E. top center or bottom left. Background: Used to include all of the previous in one. Use the order color, image, repeat, attachment, position.
The Texts This changes how the text is displayed, but mainly deals with the location of text. Color: Use a color as explained previously. Letter-spacing: If you want the default just don't use this. To change use a length in pixels. I.E. { letter-spacing: 5px }. Note that there is no space between the number and the px. Text-align: Use left, right, or center. Text-decoration: Use underline, overline, line-through, or blink Text-indent: Use a length in pixels or a percentage Text-transform: Use capitalize, uppercase, or lowercase. Word-spacing: Use a length in pixels.
The Fonts This also changes how the text is displayed, but mainly deals with the size and style of the text itself. Font-size: Use xx-small, x-small, small, medium, large, x-large, xx-large, smaller, larger, or a pixel size. Font-stretch: Use normal, wider, narrower, ultra-condensed, extra-condensed, condensed, semi-condensed, semi-expanded, expanded, extra-expanded or ultra-expanded. Font-style: Use italic or oblique. Font-variant: Use small-caps, which makes the lowercase letters look uppercase, but smaller. Font-weight: Use bold, bolder, lighter, or 100, 200, etc. to 900.
The Borders These are primarily used for fieldsets, divs, buttons, etc. but can be used for anything. Border-color: Use a color as previously explained. Border-style: Use hidden, dotted, dashed, solid, double, groove, ridge, inset, or outset. Border-width: Use thin, medium, thick, or a width in pixels. To change the color of the different border sides do as so: { border-color: #ff0000 #ffff00 #ff00ff #00ffff }. The order it colors in is top, right, bottom, left. You can do the same with the other border properties like: { border-style: dotted groove dashed inset }. It uses the same order.
The Margins The margin is the distance between one element and another. Margin-top: Use a length in pixels or a percentage Margin-right: Use a length in pixels or a percentage Margin-bottom: Use a length in pixels or a percentage Margin-left: Use a length in pixels or a percentage Margin: Used to include all of the margins properties in one. The order goes: top, right, bottom, left. I.E: { margin: 2px 4px 6px 8px }
The Paddings Padding is the distance between the border of an element and the text inside it, not to be confused with margins. Padding-top: Use a length in pixels. Padding-right: Use a length in pixels. Padding-bottom: Use a length in pixels. Padding-left: Use a length in pixels. Padding: Used to change all of the padding properties in one. Again, the order used is top, right, bottom, left.
The screenshots included are examples of what may be accomplished through editing your UberStyle.
If you have ANY questions don't hesitate to ask via PM or in my profile. Also if you just don't want to do the work I will make you a style for points. Just provide enough information. I would also like suggestion on things to add.
