Cascading Style Sheets with Dreamweaver MX
Duration 3 days
Objectives
This course guides you through the key stages of understanding exactly what CSS is and how to use it within your web pages. We will show how to use CSS effectively to control the appearance of individual page elements, page layouts and entire sites. We do this in a thorough manner, with all knowledge shared supported by practical examples.
Dreamweaver 8 has significantly enhanced CSS capabilities, and the final element of this course, held on day 3, shows you how to make the most of CSS from within Dreamweaver.
At the end of this course, we look at some of the key issues concerning Accessibility and the Web, and the particular features of CSS that will help you when creating Accessible Web sites. Requirements
Good Mac or PC knowledge. Ability to build a static web site using hand coding methods or a visual web page creation tool such as Dreamweaver MX.
Note: Although this course uses Dreamweaver MX, the skills and knowledge imparted can be deployed in any web creation tool that supports CSS.
Course Outline
Introduction to CSS
• What exactly is CSS?
• The WC3
• What are Style Sheets and why do we need them?
• CSS and HMTL
• When to use CSS
• Proprietary CSS Extensions
• Overview of CSS Level 2 revision 1
How do Style Sheets work?
• The parts of a Style Sheet
• Style Sheet Syntax
• Linking vs Embedding Style Sheets
CSS Selector Overview
• What do selectors do?
• Why you would use CSS Selectors
• Creating CSS selectors
• Browser support for CSS Selectors
CSS Statements, Comments and Rules
• About Statements and Statement types
• @rules: @import
• @rules: @media
• @rules: @page
• Comments
• HTML comment Tags
• Rules
CSS Selector Types
• Class selectors
• Type Selectors
• Type Selectors and Elements
• Attribute Selectors
• ID Selectors
• Element and Other Selectors
Introduction to CSS Properties
• What exactly are properties?
• Declarations: collections of properties
• Property name and value pairs
• Using Text Style Properties
• Using Text Layout Properties
• Using Background Properties
• Using Border, Margin and Padding Properties
CSS Properties - going further
• Using Properties for Page Layout
• Positioning with CSS
• About Layers and <div>s
• Static and Absolute Positioning
• Fixed and Relative Positioning
• Element type Properties
• User Interface Properties
• Values
Overview of Advanced CSS
• Cascade and Inheritance
• Generated Content
• Media
• Printing
• CSS Mobile Profile
Cascade and Inheritance
• Managing Style on large sites with @import
• Specificity
• Inheritance
Using CSS with Tables
• Overview of Tables and CSS
• Standards-based HTML 4.0
• Specifying Table Borders
• Specifying Table Borders Colour
• Working with Table layouts
The CSS Box Model
• About the Box Model
• Consistency Across Browsers
• The Content Area
• Margin Properties and Collapsing Margins
• Defining Padding properties
• Defining Boder Properties and Styles
Maximising Forwards and Backwards Compatibility
• Browsers: what to consider and watch out for
• About Levels of CSS Support
• Managing Missing Features
• Working around Broken Features
Using CSS with Accessibility in Mind
• Overview of Benefits of CSS for Accessibility
• Avoiding "tag misuse"
• Reducing image misuse for "cleaner" access
• Using CSS Web fonts instead of rendered text
• Author Syles Overide to allow user font selection
• Automated Content Generation for better user orientation
• Aural Styles Sheets
• CSS support for alternate content
• CSS and Broswer implementations
| 
