Website Template Font Colors

Changing Font Color, Size and Face


The colors, sizes and face of the fonts in all our templates is controled by the .css files. This does not include the Flash animation. The global css file may be named "style.css", "coolstyle.css" or "corporatestyle.css". In color theme templates the css files will be in your "colors" folder. You can edit css files in Notepad, TextEdit or a plain text editor.

Any changes you make in the .css file will globally affect every page in your template. For example:

Default text css
Allwebco templates define the default font used in the body of the HTML pages using one of the three following lines of code or variations of "table, div, body" css code. Code will be near the top of your css file.

Code following note: /* THE NEXT LINE CONTROLS THE DEFAULT FONT SIZE */

table { color: #000000; font: 12px arial, sans-serif; }

Or as a div and table:

div, table { color: #000000; font: 12px arial, sans-serif; }

Or as body:

body { color: #000000; font: 12px arial, sans-serif; }

In the above 3 examples, all text within a table, div or the body respectively will use the font sizes as defined in the code.

Title & subtitle css
Css code for template titles will be the following:

.title { color: #000000; font: 18px arial, sans-serif; font-weight: bold; }

.subtitle { color: #FF3300; font: 15px arial, sans-serif; font-weight: bold; }

.phonetitle { color: #000000; font: 18px arial, sans-serif; font-weight: bold; }


The above lines globally control the fonts for the entire template. You can freely experiment with other sizes and colors. See links below for color choices and Flash animation.

About css "line-height" line spacing
Line-height is CSS code that is used to determine how high the actual space for text should be per line. If you want more space between text lines on a template page, you can edit ,or add this code if it is not included. The code will be similar to the following in the template CSS file(s):

div, table, body { color: #000000; font: 12px arial, sans-serif; line-height: 18px; }

Line-height can be added to any type of text in your CSS file.

About "web safe" fonts
Although any font can be specified in the CSS files for the text in a template, if your visitor does not have that font installed on their computer, the website will not display webpages with that font face. In this case, the next font in the list defined by the CSS code will be displayed, i.e. "arial, verdana, sans-serif".

Fonts that are considered "web safe" include:

The Sans-serif family
Arial, Verdana, Geneva, Helvetica, sans-serif

The Serif family
Georgia, Times New Roman, Times, serif

The Monospace family
Courier New, Courier, monospace

For more info on web safe fonts and css font codes, see: CSS web safe fonts Google search.



Related Topics:
Changing Link Colors
Adding New Font Styles
Editing the Flash Animation
Adding a Second Link Class (advanced)

Links:
Font Colors
Color Mixer Software
Color Selection Website


Allwebco Template Support


Allwebco Website Template Support





Allwebco Chrome Templates
Quick color change css web templates.
AllwebcoDesign.com
Web Site Templates
Shopping Cart Templates
Professional templates with built-in Paypal.
AllwebcoDesign.com



Website Template Support
Website Template Support