MENU
Backgrounds
Tools
Tutorials
What Is
About
 


CopyScape

What Is Css

   
Other Categories In What Is
Adobe
Apng
C
Csi
Dom
Flex
Http
Java
Jsp
Mysql
Owl
Pls
Python
Ruby
Soap
Svg
Vbscript
Xforms
Xml
Xquery
Xslt
Adobe A I R
Asp
Cdf
Css
Esi
Gif
Https
Java Script
Math M L
Network
Perl
Png
Quirks Mode
Silverlight
Sqlite
Tcl
Voicexml
Xhtml
Xpath
Xsl
Ajax
Bmp
Cfml
Dhtml
Flash
Html
Iframe
Jpeg
Microsoft Sql Server
Oracle Database
Php
Postgre S Q L
Rdf
Smil
Ssi
Tiff
Wsdl
Xlink
Xpointer
Xsl-fo

The cascading style sheet is the glue that holds web pages together. While you may be able to control how a page looks using JavaScript, if this is disabled on the visitor’s browser then it is pointless. You can code the look of a web page using the HTML tags; however this is nowhere near as robust as a CSS file. Furthermore, the tag based styling of a web page is slowly being removed from a browser’s capabilities as developers begin leaning more towards the use and expansion of the style sheet language.

Style sheet serve more functions than simple styling a webpage’s HTML code, it can also be used on XHTML as well as XML and even SVG and XUL languages. Furthermore, a visitor can develop his or her own style sheet and build it into their browser allowing them to change anything they want to on a particular web page.

The development of the cascading style sheet and the reasons why it is becoming increasingly difficult to style a page in HTML tags, is because the concept of the CSS is to create separation from the visual elements and the physical code. It plainly keeps things a lot cleaner looking and easier to change and update site wide.

Content accessibility, flexibility and control are what the cascading style sheets are about. While used mainly in the development of tabless web design, many of the same styles can also be used to control the look of a table as well. A web designer can make a page printable and more readily accessed simply by having multiple styles for a given area.

The term cascading in the name refers to the prioritisation given to the styling elements added to the CSS file. If you want to style a particular division, you can have more than one entry of the same type based on the use of classes and IDs. This allows for more than one rule to be matched and allows it to cascade over itself like the ripples over a waterfall. These multiple rules can be things such as a different layout in the case in which the visitor is using a speech-based web browser or even a text based one.

In general, the syntax of CSS is very simple. The use of English words allows one to specify any number of possible styling properties such as the font, borders and backgrounds. A division, or a block which ever way you choose to look at it, is designated with either a class, ID or both in the physical HTML and this designation is styled on the style sheet separately.

In all simplicity, the block’s name will follow either the pound sign for an ID or a decimal point for a class. After this, there will be a curly bracket, the style type followed by a colon and its definition. Each style type and definition ends with a semicolon and the whole block is ended with the opposite curly bracket. For ease of reading, following the first curly bracket and line break and a single tab should separate each style element but this is not mandatory. Furthermore, CSS is generally white space insensitive except in cases such as multiple definitions for a single style type.

Other concepts can also be included such as the declaration of changes in the style if it is a link. These are sensitive to order and include link, hover, visited as well as active. Furthermore, elements within a block such as unordered lists can also have different styles based on the block they are in. In these cases, just like with the link, following the descriptor you would have UL and its style definitions.

Going back to the basics, in HTML you have the heading tags like H1. These are great, but what if the Header 1 tag is too large, or it is a link or even needs to be a different colour? Well these can be styled as well just like a division. Images too can be styled and so much more. Basically there is almost no part of the web page or the HTML code which cannot be styled using the Cascading Style Sheets. This does have some limitations to it though because while using Mozilla Firefox, the page may look perfect, switching to another browser can produce dramatic differences. The most notorious offenders of this is none other than Windows Internet Explorer.

To put it bluntly, the vast majority of web developers despise IE. For starters it is not as secure as the other choices. But most importantly is the fact that Windows develops operating systems and those get most of the developers’ attention. As a result, most web developers have to work sometimes 3 times as long to get the same page to look similar in Internet Explorer. In most cases this is done using JavaScript hacks which force the browser to render the page a certain way. Once again though, if the person’s browser has JavaScript disabled, who knows what they may see when visiting a web page.

There is still a lot to be done with the Cascading Style Sheet but it has to be done in small steps. There have already been a number of positive updates such as the allowance to create a four cornered tabbed region using a single image and positioning them so they create the desired look.

As more development into the style sheet language is done, who knows what the future may bring. Maybe someday a web developer will be able to think outside of the box rather then being limited to squares and rectangles in their web page developments.

Original Authors: Nick
Edit Update Authors: M.A.Harris
Updated On: 09/02/2009


Program Software Development © Globel Limited UK LOGON