Thursday, March 25, 2010

Cascading Style Sheets (CSS)

What is CSS?

Cascading Style Sheets (CCS) is a language used to describe the look and format of a document written in a markup language from an external document. CSS is most commonly used today with HTML and XHTML to control the appearance of websites; however, it can also be applied to any type of XML document.

History of CSS

Various forms of external style sheets have existing since the 1970’s. CSS as we know it has been in development since the early 1990’s. When the concept of style sheets for XML languages was first proposed, nine different languages were considered. Two of these languages, Cascading HTML Style Sheets and Stream-based style sheets, became the foundation for CSS Level 1. In 1995, the World Wide Web Consortium became interested in CSS, and by the end of 1996 CSS Level 1 was officially recommended by the W3C. After the release of CSS1, the W3C went back to work improving CSS and developing CSS2, which was released in 1997. W3C has been working on CSS3 since 1998 and it is still in development.

Problems with CSS

While the theory behind Cascading Style Sheets is sound, its execution has had problems. The biggest problem CSS faced, and still faces today, is browser adoption. Internet Explorer 3 was released in 1996 and was the first browser that supported CSS however the extent of the support was minimal. It was not until 2000, with the release of Internet Explorer 5, that browsers almost completely supported CSS1. Other early browsers had minimal support but there were also serious incompatibilities. Only now are browsers starting to more fully support CSS2.

The most common of these support problems is with older versions of Internet Explorer—it is called the box model. Ordinarily, in compliance with W3C standards, the “width” that is specified is for the content. This “width” is then surrounded by padding, border and the margin in that order. Each of these levels adds to the overall width of the original content. In Internet Explorer the “width” refers to the width of the content, plus padding and the border. Margins are added on the outside of the “width” addition. The end result is that websites can look different between Internet Explorer and other browsers unintentionally. Various fixes have been made available and newer versions of Internet Explorer have since resolved this problem.

Why Use CSS?

CSS is used to separate the content of the document with the code to style each page. This allows for increased accessibility and increased flexibility, especially across different browsers, since different style sheets can be applied depending on the browser. CSS can be applied quickly and easily across multiple pages of content, allowing for easy maintenance and reformatting. CSS requires less bandwidth, since the style sheet only has to load once and then the browser will store the information making websites load faster where there is a lower bandwidth.

The most important reason to use CSS, however, is that it is remarkably powerful despite some of its shortcomings. The best demonstration of this is at This website allows users to take standard HTML and change the appearance just through CSS.


No comments:

Post a Comment