Basic Over View of CSS

CSS means Cascading Style Sheets which is written in a markup language and most commonly applied to web pages written in HTML, XHTML and to any kind of XML document. CSS specifications are maintained by the World Wide Web Consortium (W3C).

Before CSS, almost all of the attributes of a HTML document were contained within the HTML markup and often repeated. All font colors, background styles, element alignments, borders and sizes had to be applied. With CSS all these repeated HTML tag can be moved to a separate stylesheet resulting in cleaner and faster HTML.

CSS style information can be either attached as a separate document or embedded in the HTML document.

CSS has various levels and profiles. Each level of CSS builds upon the last version while adding new features and attributes. Once a new level is created, the CSS name gets a build number like CSS1, CSS2, and CSS3. Different levels of CSS is built for a particular device or user interface. There are currently levels for mobile devices, printers, and television sets.

CSS specifies a priority scheme to determine which style rules apply if more than one rule matches against a particular element. A style sheet consists of a list of rules while each rule consists of one or more comma-separated attributes then semicolon-separated declarations and placed inside curly brackets ( { } ). Each declaration itself consists of a property, a colon ( : ) then a value then semicolon ( ; ).

Different to add CSS to your site:
External stylesheets - placed in the server or on another server.
Embedded - placed inside the head.
Inline styles - style information on a single element.

Internal stylesheet:
<link rel="stylesheet" href="example.css" type="text/css" />

External stylesheet:
<style type="text/css">
@import "example.css";
</style>

Embedded stylesheet:
p {
font-family: "Garamond", serif;
color: black;
}

Inline stylesheets:
<h1 style="color: #0000ff;">a blue headline</h1>

Advantages:
An entire website can be held in the same place, and can be updated quickly and easily.
Different users can have different style sheets - a layout can be optimized for small displays and for mobile phones.

The document coding is reduced and increases speed while reducing weight.

One of the goals of CSS is also to allow users a greater degree of control over presentation like designs that require several background images... CSS can only support only one image.

CSS1 support font properties, text color, background color (and other elements), text attributes like spacing between words, letters, and lines of text, alignment of text, images (and other elements), margin, border, padding, and positioning for most elements.

CSS2 includes a new capabilities like absolute, relative, and fixed positioning of elements, the concept of media types, support for aural style sheets and bidirectional text, and new font properties such as shadows.

Problems of CSS2 are actually results of browser bugs or lack of support for CSS features. The most serious offender among current browsers is IE 6 doesn't support many CSS2 properties or misinterprets them, such as "width", "height", and "float".

CSS3 is currently under development.

Resources:
http://www.visibone.com/products/browserbook.html
http://www.w3schools.com/css/css_reference.asp

No comments:

Post a Comment