All about CSS rules. selectors, properties

Aug 24, 2007 15:18 GMT  ·  By

CSS(Cascaded Style Sheets) defines how to display HTML documents. CSS is used by both the authors and readers of web pages to define colors, fonts, layout and other aspects of document presentation. It is designed primarily to enable the separation of document content (written in HTML or a similar markup language) from document presentation (written in CSS).

CSS syntax is made from 3 parts: a selector, a property and a value. For example: selector {property:value}. The property is assigned to a selector to manipulate its style. Each property can take a value. If the value has multiple words, use quotes: body {font: "Courier New"}. Multiple style declarations for a single selector can be separated by a semicolon: p {text-align:right;color:black}. This example shows how to align a paragraph to the right with a black text color.

We use selectors to associate style declarations with an element or various elements. You can do that if you place the declarations within a block (enclosed in {}) and preceding it with a selector. There are 6 kinds of selectors:

- Tag selectors page {color: green} - Class selectors - allows you to give a certain name to the elements: p.center {text-align: center} - Pseudo-Class selectors. They can be assigned to the A element to display links, visited links and active links differently. - Span - DIV is like SPAN but it may contain paragraphs, headings, and tables. - ID Selectors can be only an element with a given ID in document. The ID Selector is assigned by #.

To define rules, you may use the following attributes: - Case sensitivity: If you use this, all css will be case insensitive - Inheritance: inherit the property values assigned to the outer selector - weight sort - order sort - !important: set the importance of the declaration

CSS properties are divided in: font properties, color and background properties, text properties, box properties, classification properties and units.