FSS - Getting Started
Deprecated
This page is currently deprecated, and will be removed shortly. For more up-to-date documentation, see our main FSS page and the pages it links to.
Join the infusion-users mailing list and ask your questions there.
Walk-throughs
We provide several pages that will walk the user through the FSS. The walk-throughs describe how to use various functionality of the Fluid Skinning System (FSS) style sheets. They provide basic examples you can build on and customize to suit your site's needs.
For more detailed information on how CSS is modularized and used in the FSS, please refer to the Fluid Skinning System (FSS) introductory article.
An introduction to CSS and how it works is beyond the scope of these walk-throughs and can be found at the W3C.
Files and Demos
The walk-throughs are meant to accompany functional demos that showcase available functionality of each FSS style sheet:
Walk-through |
Description |
Functional Demo |
Style Sheet |
|---|---|---|---|
Deals with the sub-division and positioning of container elements on a page |
|||
Deals with convenience classes for ready-made GUI setups (ie. Tabs, Widgets, Menus, etc.) |
|||
Deals with colour schemes and "window dressings" for basic markup and FSS Helpers (ie. Tabs, Widgets, Menus, etc.) |
fss-theme-mist.css fss-theme-coal.css fss-theme-slate.css fss-theme-hc.css fss-theme-hci.css |
||
Deals with text and header types, spacing, and sizes. |
CSS Reset File: While optional, it is recommended that you use a CSS "reset" file to ensure full functionality of the FSS. A CSS reset file usually defines a large group of basic rules to normalize the CSS differences inherent in all browsers, so it would need to go before any other CSS data in your page. It is especially useful when it comes to textual content.
There are many CSS reset files available on the web, including YUI CSS Reset and Eric Meyer's Reset. The FSS is provided with its own reset and base files( fss-reset-global.css, fss-reset-context.css, fss-base-global.css, fss-base-context.css ), which are based on the YUI Reset, Base, and Fonts files. As the names suggest, the reset and base files can be used either to globally affect the styles of a page or scoped within a particular context.
Please note: All FSS class names use the fl- prefix. In the functional demos, you may find other class names without this prefix; these are used purely for demonstration purposes, and can be safely ignored.