Agenda II
Xhtml Rules
DocType
XHTML Tags
Why CSS?
Styles Types
Font CSS
Inline CSS
Embed CSS
Linked CSS
CSS Attributes
Text CSS
Hex Colors
List CSS
Background Images
Display Position
Z-index
Border CSS
Classes and IDs
Div & Span
CSS Summary
Table Summary
Frame Summary
Table Attributes
Basic Tables
Table Padding
Column Span
Table CSS
Collapse Border
Frame Basics
Frame Attributes
3 Color Frame
Nested Frames
Inline Frames
|
Define and Apply CSS Classes and IDs Elements |
- Class style rules are defined in the head element.
- CSS rules are between the style element <style type="text/css"> </style>
- Classes are created to individualize styles
- Each class begins with a period followed by the unique class name.
- Classes are applied to any xhtml element or text block using div and span selectors.
- No programming terms can be use as class names.
- When applying the classes, the period is not used and the name is quoted.
|
<style type="text/css">
.mid {text-align:center}
</style>
In the body: <div class="mid">Centered Text<div/>
|
|
CSS ID Selector - #idname {property:value}
- IDs are defined in the head between the style elements <style type="text/css"></style>
- IDs begin with a pound sign (#) an a unique term.
- IDs are used only once on a page.
- Apply the ID term without the pound sign
- Applied to any xhtml element, div or span elements
- These special selectors allow JavaScript functions to manipulate objects defined with the pound sign.
<style type="text/css">
#lively{font-family:Zapf Chancery}
</style>
In the body:<span id="lively">This is fancy text.</span>
|
|
|
|