What is CSS ?- Cascading Style Sheets
What is CSS? This is a common question asked by most web users hoping to understand how websites are created when they encounter the three letters on the web? Almost everyone is familiar with Html as it is a simple markup language but CSS seems to be an enigma. Since most of our work in developing web apps based on Drupal revolves around CSS, we have decided to share our knowledge with you.
CSS or Cascading Style Sheet is used to describe the style of document presentations in web development.Style Sheets are templates that contain a collection of rules declared to various selectors (elements). CSS is specifically meant to separate content (written in HTML or a similar markup language) from presentation, including elements such as the layout, colors, and fonts.If more than one rule affects a particular element, CSS is the one that decides which rule to apply by using a priority scheme. So this results in a cascade, where priorities or weights are estimated and assigned to a set of rules,which will result in a predictable pattern.
When the same elements can have many properties and some of these properties may conflict with one each another, CSS comes into play.
For example, you might set a font color of green on the paragraph tag in the beginning and later set another color like for instance, blue,the colour that is taken is determined by CSS.CSS is set to take the colour that is defined last ( ie ,priority is given to the one that is defined last)
There are three different types of style sheets which are
- Author Style Sheets : styles are created by the author of the Web page
- User Style Sheets : styles are set by the user of the Web page
- User Agent Style Sheets : styles that the Web browser applies to the page to help display that page.
There are two ways of adding CSS,either by using external style sheet or embedded styles.
Syntax of a CSS
- It comprises a list of rules.
- Each rule or rule-set consists of selectors and a declaration block.
- A declaration-block contains of a list of declarations enclosed in braces.
- A declaration has a property, a colon (:) and a value.
- A semicolon is used to separate multiple declaration blocks
- Pseudo-classes used to identify markup elements
Use of CSS
Before CSS was introduced,setting font colours,background styles, element alignments, borders and sizes was a tedious process.They had to be explicitly described, often repeatedly, within the HTML.CSS takes care of this by letting the authors put that information to a separate style sheet resulting in simpler HTML markup. Headings,sub-headings ,sub-sub-headings are defined structurally using HTML. In print and on the screen, choice of font, size, color and emphasis for these elements is presentational.
Levels
CSS has levels instead of versions. Each level of CSS builds on the previous one,refining definitions and adding new features. The feature set of each higher level is a superset of any lower level, and the behavior allowed for a given feature in a higher level is a subset of that allowed in the lower levels.The various levels are CSS 1, CSS 2, and CSS 3.
A final note on CSS
Though there is the issue of browser compatibiltiy in using CSS,its advantages outweigh this minor problem.CSS offers better typography and page layout controls,easy to maintain sites,storage of style sheet information that is separate from your HTML document, and shared among many HTML files. Also the entire design of the site can be updated by changing just a single style sheet.So CSS saves a lot of time and work which is surely a welcome thing in the web development scenario.
