This post is going to be going over all the Type CSS Properties and giving you the properties of each item. Since I like Adobe Dreamweaver’s GUI so much I will use a screen shot of it as a reference because it provides a clean and compact way of organizing the properties.
CSS Font Families
1: font-family: Verdana, Geneva, sans-serif;
2: font-family: Georgia, "Times New Roman", Times, serif;
3: font-family: "Courier New", Courier, monospace;
4: font-family: Arial, Helvetica, sans-serif;
5: font-family: Tahoma, Geneva, sans-serif;
6: font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
7: font-family: "Arial Black", Gadget, sans-serif;
8: font-family: "Times New Roman", Times, serif;
9: font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
10: font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
11: font-family: "MS Serif", "New York", serif;
12: font-family: "Lucida Console", Monaco, monospace;
13: font-family: "Comic Sans MS", cursive;
CSS Font Size:
1: font-size: 12px;
2: font-size: 12em;
CSS Font Weight
1: font-weight: normal;
2: font-weight: bold;
3: font-weight: bolder;
4: font-weight: lighter;
CSS Font Style
1: font-style: normal;
2: font-style: italic;
3: font-style: oblique;
1: font-variant: normal;
2: font-variant: small-caps;
CSS Line Height
1: line-height: normal;
2: line-height: 12px;
3: line-height: 12em;
CSS Text Transform
1: text-transform: capitalize;
2: text-transform: uppercase;
3: text-transform: lowercase;
4: text-transform: none;
CSS Text Decoration
1: text-decoration: underline;
2: text-decoration: overline;
3: text-decoration: line-through;
4: text-decoration: blink;
5: text-decoration: none;
CSS Text Color
1: color: #000; /* Black */
2: color: #FFF; /* White */
CSS Example for <p>
1: p
2: {
3: color: #000; /* White */
4: font-family: "Arial Black", "Gadget", "sans-serif";
5: font-size: 12px;
6: font-style: normal;
7: line-height: normal;
8: font-weight: normal;
9: font-variant: normal;
10: }
Leave a Reply