Changing and Using this Template's Style Sheets

Following are quick, simple tips for understanding and changing the Style Sheets we use in this Template... This is not an extensive lesson in Style Sheets and CSS — just enough info to help you change THIS template!

How to read the Style Sheets: 

Open any of the Style Sheets in your HTML editor — FrontPage, Dreamweaver, etc.

The first sets of HTML code (the "a" tag, "body", "table, td, P, etc") are there to set the default fonts, colors, hyperlinks, Heading tags, tables, etc. So is the "table.amain" — this tag dictates the SIZE of the layout, its borders, etc.

If you want the backgrounds or default font colors to change, this is the place to do it! The rest of the tags exist to define "special" tables and cells... for example: 1. .navigation = the bars where the top and bottom navigation are located... the tag BELOW this, with the "hover, link, etc.", is what defines the special hyperlink qualities for ONLY the Navigation bars! Note: The same basic rule applies to the ".copyright" tag and the tag located below it — you'll find several main tags that work like this. It's the beauty of a Style Sheet! Using these tags allow us to set up unique areas with different formatting. 2. You'll see several tag names, such as ".guide", ".highlight", ".navside". Each of these tags corresponds with one or more tables or cells in the Template. To find out which tag goes with a cell or table, simply right click in it, choose "Properties", then click on the STYLE button on the bottom left of the table or cell property screen. You'll immediately see a block called "Class". Whatever is in that block is going to match with a tag in the Style Sheet! If there is NOTHING named in the Class block, that probably means that it is using the "default" format for the "body". Changing the Style Sheet: It's easy! 1. Just locate the CORRECT STYLE SHEET for the page you're working on, then look at the Style/Class in the table or cell properties screen. 2. Find the corresponding tag in the correct Style Sheet (see the table at the top of this page). 3. Change the font, background, cell padding, style, etc., to whatever size or HEX colors you have chosen, then SAVE the .CSS page back into the directory of your web site Template! WARNING: Do NOT remove formatting codes like "}, {, ;" — these codes are CRITICAL to whether or not the Style Sheet works!