The main advantage of using CSS [Cascading Style Sheet] is that it allows you to create separate styles for different media types. This is one of the interesting ways to build printer friendly web pages as you just have to assign a different style sheet for the “print” media type.

How to test the style sheet?

The fastest way to test a style sheet is by visiting that page on your cell phone. But it would be best to build up the basic styles before you have to publish the page and the cascading sheet live on Internet. This will ensure complete safety and security, preventing anyone from viewing your style sheet, till its done or nearly done. So if you do not have a cell phone ready or a handheld device near you, it would become highly difficult to test the style sheet.

Change of media type to “screen” for testing

When you are building a media type CSS document, you should set the media type on the pages you are testing, to “screen” or “all”. This will help you to view how the page would look like in other media, when you come to that page in the web browser. Further, you can also make some quick adjustments in an offline environment.

Once you have got the page working, as you would like it to be, switch the media type back to other device it is designed for and publish the page.

Advantages of testing

This method is highly advantageous as this technique proves to be outstanding not only testing handheld, projection an TV styles but also use it for your print style sheets too. This way you will be prevented from wasting paper while you are testing and you have a great way to know that your print styles sheets are working well.

Using Advanced CSS site – How’s and Why’s?

Cascading style sheets appear on the top slot of the list required to keep your site consistent. The easiest way to conduct this is to link or import an external style sheet. If you are using the same external style sheet for every page of the site, then you can be sure that all the pages will display the same style and format. This is how CSS assists you to keep your site consistent.

Advantages of External Style Sheets

External style sheets have a host of advantages for you:

1. It allows you to control the look and feel of several documents, at tandem. This becomes especially useful if you work with a whole team of people, who require creating multiple documents for the same web site. Many of the style rules can be truly difficult to remember, and while you have a whole printed style guide, it becomes inefficient and tedious to continuously flip through it to determine the exact font and color details of the example text.
2. You can create different classes of style that can be further used on different HTML elements. This means that you might desire to use the font style “Verdana 10-Bold” as a special font, wherever you want to emphasize some word or lines. Instead of defining the style manually for every instance of emphasis, you can just set up the style – “Verdana 10, Bold” on the style sheet and all the emphasized words will take that style automatically.
3. It also easily groups your styles to be highly efficient. All the grouping methods that are available to CSS [Cascading Style Sheet] can be used in external style sheets, and this in turn allows you with more control and flexibility on your pages.

Steps to create an external style sheets

External style sheets are created with similar syntax to document level (in the ) style sheets. However, you need to include the selector and the declaration. Just like used in a document level style sheet, the syntax for a rule is as follows:

Selector {property: value;}

You need to save all these rules into a text file with the ectension .css.

However, once you have a style sheet, you need to link it to the web page. This can be completed in two ways:

Linking

In order to link a style sheet, firstly, you need to use the HTML tag . This has attributes like rel, type and href. While rel attribute describes what you are linking, i.e. the style sheet; type defines the MIME-Type for the browser, and the href is the path to the .css file.

For example,

Importing

You have to use an imported style sheet within a document level style sheet, so that you can easily import the attributes of an external style sheet while not losing any specific documents. You can do it in the same way as calling a linked style sheet, only it must be called within the document level style declaration.

For example:

<style>
    @import URL (http://www.yoursite.com/styles.css);
    /* continue styles */
</style>

You can import either single or multiple external style sheets, as per the style sheets required to maintain your website.

Disadvantages of External Style Sheets

External style sheets also have various disadvantages:

1. External style sheets can increase the downloading time, since they are extremely large
2. You always have to wait until the entire style sheet has loaded, and before the page can be displayed
3. If you have less number of styles, they can enhance the complexity of your website

External style sheets get unnecessarily big so it becomes hard to tell when a style is no longer in use, because it gets deleted when the page is removed