Monday, August 27, 2007

css

External stylesheets contain cascading stylesheet, or CSS, information used by a browser to display your web page with the styles you intended to use. These styles can be as simple as defining the font and font color, to as complex as layouts with three column without using tables.
There are four different ways CSS information can be supplied. See cascading order of CSS for more information.
The most efficient way to supply a browser with CSS information is by using an external css stylesheet.
What is an external CSS stylesheet?
An external CSS stylesheet is a separate file containing all the style information for a web site. These files have a .css extension and are commonly named style.css. The name of the file is irrelevant.
Why use an external CSS stylesheet
The benefits of an external stylesheet are:
Reduced bandwidth. Browsers typically only request one copy of your external CSS stylesheet, then caches that copy and won’t request your server for another copy for a certain period of time. The cache can be over written by refreshing the page. If this doesn’t work, try refreshing the external stylesheet itself.
External CSS stylesheets also reduces bandwidth by enabling your html code to be a clearer and contain less redundant style information. The smaller your file size, the less bandwidth is required to send the file out to the browser. For example, if wanted all tags of your web site to be vertically aligned in the center, instead of using for every single tag in your html document, simply define the vertical alignment in the external stylesheet and in your html document, all you will need to use is and all will be vertically aligned.
Easier to maintain. Instead of defining a style for a particular element over and over again, you only need to define it once in external stylesheet. External stylesheets also enable altering the whole look of a web site by changing one file, the .css file.
How do I create an external CSS stylesheet
External CSS stylesheets can be created using a simple text editor. Most PC’s have Text Pad which is the standard text editor, Mac’s have TextEdit which is the standard text editor. I recommend BBEdit on Macs as a text editor as it has many features a standard text editor doesn’t usually have.
To create an external CSS stylesheet, open up a new file and enter in the style information for that site. For example (as taken from Zann Marketing’s Developer blog styles):

No comments: