Home / Software / Tips and Tricks / Diffrent methods to add CSS style to a web page

Diffrent methods to add CSS style to a web page

Updated:  11/24/2012 05:11 AM
Author:  Shiju Mathews

Status:    Resolved.


There is more than one way to add a Cascading Style Sheet (CSS) to your HTML document. Here I am going to explain the three popular methods of adding CSS to a HTML Page.

1. Linking to a separate CSS file
        This is the most common method of attaching CSS rules to an HTML document. With this method all of your style rules are contained in a single text file that is saved with the .CSS extension. This file is saved on your server and you link to it directly which has access from the website.
This css file can be added to the web page by using an entry in the section of your HTML document.

This method enables the centralized management of CSS style across the website.

2. Embedding a CSS section into the HTML
        CSS rules can be embed directly into any HTML page. To do this you need to add the CSS section to the or of your HTML document before using it:



OR
In this method the whole web page CSS can be defined in one area or it can be an addition to the existing CSS for the page.
      The advantage of this method is that the web page contains the whole code and no additional files to be downloaded. This will improve the performance of the page. Another advantage is that, if the web site has a common CSS file attached just like the previous method and the developer wants to add some extra style just for the page, this method is very handy.

3.Adding Inline CSS to HTML tags
        Style rules can also be added directly to any HTML element.

This method very simple and enabiling css style for each element.