Cascading Style Sheets (CSS) Explained
The latest version of the district website, along with
several other school and program sites, uses a cascading
style sheet to help control formatting and layout on every
page. CSS, in the simplest of terms, is either a set
of tags on a web page or an external
web document that controls the look and feel of a
website.
CSS can be used to control just the textual elements, or
it can control the entire look and feel of a page right down
to the layers and tables. Using the appropriate tags that
are defined by the CSS document, every element of a
page can be finitely controlled and made to look the same in
every
browser type and version (that supports CSS).
From the Front Page Help Pages:
A cascading style sheet (CSS) defines the styles that you
can apply to pages or page elements. Each style definition,
or style rule, consists of a selector
followed by the properties and values for
that selector. The following are simple examples of style
rules defined in a style sheet:
H1 { font-size: x-large; color: green }
H2 { font-size: large; color: blue }
.note { font-size: small }
#footer { font-family: serif }
In the example, H1 and H2
are selectors that modify the formatting properties of
standard HTML tags. The selectors' properties and values are
contained within the curly braces { } — font-size
is a property, and x-large is the value of
the font-size property. You can specify multiple properties
for a selector by separating each with a semi-colon ( ; ).
In the example, .note is a class
selector, and #footer is an ID
selector.
Front Page 2000 supports CSS in several ways.
- Link a page to an external style sheet.
- Create an embedded style sheet on a page.
- Apply inline styles to individual page
elements.
Note: For the sites that the Unit 5 Web
Manager has built for Unit 5, Front Page 2000's built in
support for CSS was avoided and everything done manually to
ensure the best results possible.
A simple example of internal CSS tagging:
A simple example of a CSS sheet would be the one used for
this very set of pages:
You can learn more about CSS at the following sites:
|
