Fonts
Changing Font Color
#section_name { color: #XXX; }
Changing Font Size
#section_name { font-size: 0px; }
Types of Font Measurement:
px- Pixels
pt- Points
in- Inches
%- Percent
You can also use these systems in anything that has a size or measurement. The two most common are px and %.
Changing Font Style
#section_name { font-style: italic; }
Types of Font Styles:
normal- Normal text, no changes.
italic- Slants the text.
small caps- Unsure.
oblique- Unsure.
Changing Font Weight
#section_name { font-weight: bold; }
Types of Font Weights:
extra-light
light
demi-light
medium
bold
demi-bold
extra-bold
Changing Font Type
#section_name { font-family: arial, helvetica; }
Please note that most tutorials suggest you list at least TWO different font types. This is so in the case that a browser cannot read your first choice, it will go to the second. Always make sure your last choice is one that all browers can identify.
Aligning The Text
#section_name { text-align: left; }
Possible Alignments:
left
center
right
Decorating The Text
#section_name { text-decoration: underline; }
Possible Decorations:
italic
blink
underline
line-through
overline
none
Indenting the Text
Similar to text align except you have more control over the text placement. As always indent starts from the left side.
#section_name { text-indent: 0px; }
Alot of people use text-indent to "remove" the text from their headers by either using a very large number or a negative number. This basically pushes the text out of the header area, however you cannot replace the text, you must place your new text as part of the header background image.
One problem with indenting the text so far "off" the screen is if you have a horizontal scrollbar in the section it will cause the scrollbar to scroll as far as the text is.
Changing the Spacing Between Words
#section_name { word-spacing: 0px; }
This will add white space in between your words. The amount depends on the number you put in.
Changing The Spacing Between Letters
#section_name { letter-spacing: 0px; }
Adds white space in between letters.
Transforming the Text
#section_name { text-transform: uppercase; }
Changes all text w/in a section to a certain format.
Possible Transformations:
uppercase- Changes all letters to uppercase.
lowercase- Changes all letters to lowercase.
capitalize- Capitalizes the first letter of each sentence of line.
View User's Journal
CSS Profile Codes
This is a basic and advanced tutorial on how to CSS profiles.
 |
Unfrigginbelievable
Community Member |
Legalize