Learn something new every day More Info... by email
Cascading Style Sheet (CSS) is a way to design a website, or a group of websites, so that they have a consistent look and feel, and so that their look and feel is easy to change. By using CSS to design a website, the web developer gains a greater degree of control over how the site appears.
A web developer can use a CSS file to control the look of a website in three main ways. The first way is called inline, referring to the fact that the code is placed right into the line of the website code. For example, a web developer might want to make a particular sentence appear in bold, red type so that it stands out. She could use CSS to set the style of that sentence to bold and red using inline code. The benefit of this method is that it allows a quick and easy change to a particular part of a web page.
Another way that a web developer can use CSS is to make rules for a single web page. In this case, the developer would use what is called embedded CSS. The developer can, for example, make each new paragraph indent and each header in bold. The embedded instructions are usually placed at the top of the web page's code.
This allows the developer to change the embedded code once and have the effects take place throughout the entire page. If he decided to put all headers in italics rather than bold text, he could simply change the style coding, and all the headers on that page would change. This has an advantage over the inline method in that it covers the entire web page, and changes can be made to the entire page at once.
The final common type of CSS is what is known as an external CSS. A web developer will write the code to apply to an entire group of web pages, a whole website, or even multiple web sites. These rules can include things like background color, text color, word spacing, and other elements of page layout, just like the previous two examples of CSS.
The difference is that these instructions are not for a single section of the page, or just one web page, but for an entire website. The advantage is that the look and feel of an entire website can be changed at one time by making changes to the external style sheet. If the designer wants to try a new background color or a new font for the entire website, she can do so with the change of a few lines in the external code, rather than going to each page individually and making changes there.
The disadvantages to both embedded and external CSS is that there is more time involved in creating a large style sheet, which will cover a great deal of layout, rather than making smaller changes to individual lines. The web designer must decide if it is more efficient in the long run to make individual inline instructions, or to make an embedded or external CSS to take care of many design features at the same time.
I like to use about two external style sheets for a page, especially if I have something like a snippet that I want to style. That way if I want to remove the snippet, I can save memory by also remove the stylesheet for that snippet.