Home |

Home>Computer Programming>CSS> Introduction To Cascading Style Sheets By Mitchell Harper        [Hits: 8567] CSS (Cascading Style Sheets) have been around for a while now,and act as a complement to plain old HTML files. Style sheetsallow a developer to separate HTML code from formatting rulesand styles. It seems like many HTML beginners¡¯ under-estimatethe power and flexibility of the style sheet. In this article,I¡¯m going to describe what cascading style sheets are, theirbenefits, and two ways to implement them. --------------------------------------- Cascading whats?--------------------------------------- Cascading Style Sheets¡­that¡¯s what! They¡¯re what paint is tocanvas, what topping is to ice cream¡­ they complement HTML andallow us to define the style (look and feel) for our entire sitein just one file! Cascading style sheets were introduced to the web developmentworld way back in 1996. They get their name from the fact thateach different style declaration can be ¡°cascaded¡± under the oneabove it, forming a parent-child relationship between thestyles. They were quickly standardized, and both Internet Explorer andNetscape built their latest browser releases to match the CSSstandard (or, to match it as closely as they could). So, you¡¯re still asking what a style sheet exactly is? A stylesheet is a free-flowing document that can either be referencedby, or included into a HTML document. Style sheets use blocks offormatted code to define styles for existing HTML elements, ornew styles, called classes. Style sheets can be used to change the height of some text, tochange the background color of a page, to set the default bordercolor of a table¡­the list goes on and on. Put simply though,style sheets are used to set the formatting, color scheme andstyle of an HTML page. Style sheets should be used instead of the standard , , and tags because: - One style sheet can be referenced from many pages, meaningthat each file is kept to a minimum size and only requires onlyextra line to load the external style sheet file - If you ever need to change any part of your sites look/feel,it can be done quickly and only needs to be done in one place:the style sheet. - With cascading style sheets, there are many, many pageattributes that simply cannot be set without them: individualtags can have different background colors, borders, indents,shadows, etc. Style sheets can either be inline (included as part of a HTMLdocument), or, referenced externally (Contained in a separatefile and referenced from the HTML document). Inline style sheetsare contained wholly within a HTML document and will only changethe look and layout of that HTML file. Open your favorite text editor and enter the following code.Save the file as stylesheet.html and open it in your browser: