CSS Masterclass
Why CSS?
Proficient use of CSS (Cascading Style Sheets) enables web designers to create sites that:
- are quicker and easier to develop and maintain,
- download faster,
- are visually consistent,
- are more accessible,
- provide a better user experience and
- rank better with search engines.
Who should do this course?
Anyone who is already using CSS-based layouts but has encountered problems with making CSS designs work in multiple browsers and who wishes to understand the impact of Internet Explorer 7 on existing websites. Participants should have completed the Advanced Website Design Using CSS course or have equivalent knowledge prior to commencing this course. A sound understanding of both XHTML and CSS (including creating layouts with both floats and positioning) is assumed.
About the course:
During this 3 day course, participants will learn how to:
- use advanced CSS selectors,
- understand the cascade, specificity, and inheritance,
- use background images to create round-cornered boxes and drop shadows,
- use PNG alpha transparency,
- create complex buttons and rollovers,
- apply conditional comments and band pass filters for Internet Explorer,
- create liquid and elastic layouts,
- employ a variety of hacks and filters to hide and/or show CSS to specific browsers,
- learn a systematic approach to bug hunting, and
- squash a range of common CSS bugs.
Quick Facts
| Level: |
Advanced |
Price: |
$1650.00 incl GST |
You will receive: |
| Duration: |
3 Days |
Discounts*: |
2 Students - 10% |
- Certificate of completion |
| Size: |
10 |
|
3 Students - 15% |
- Training Manual |
| Times: |
9.00am to 5.00pm approx |
|
4 Students - 20% |
- 12 months FREE email support* |
| Pre-requisites: |
Refer to course description |
Bonus: |
2 FREE |
- FREE class re-sit (if necessary)* |
| |
|
|
Movie Tickets |
Course Brochure: |
| |
|
|
|
CSS_Masterclass.pdf |
| |
|
|
|
|
| * Conditions apply. |
|
Upcoming Courses
|
Sydney
Level 11, 32 Walker Street
North Sydney
View map
|
- Date:
- 16-18 Mar 10
- 27-29 Apr 10
- 07-09 Jun 10
|
|
Melbourne
Level 12, 379 Collins Street
Melbourne
View map
|
- Date:
- 17-19 Mar 10
- 16-18 Jun 10
|
|
Brisbane
C/- Support Technology, Level 6, 371 Queen St
Brisbane
View map
|
- Date:
- 19-21 Apr 10
|
|
Canberra
C/- Training Choice, Level 12, 15 London Circuit
Canberra
View map
|
Date: upon demand
|
|
Adelaide
C/- Mindfull Computer & Seminar, Level 4, 74 Pirie Street
Adelaide
View map
|
Date: upon demand
|
For more information on dates or locations, please call
1300 888 724 or
enquire online.
Course Units
- Unit 1: CSS Foundations
- - Structuring code correctly
- • Meaningful markup
- • DOCTYPE switching and browser modes
- • Validation
- - Advanced CSS selectors
- • Universal selector
- • Child and adjacent sibling selectors
- • Attribute selectors
- - The cascade and specificity
- - Inheritance
- - Planning, organising, and maintaining stylesheets
- • Adding and removing comments
- • Optimising your stylesheets
- • Style guides
|
- Unit 2: The Visual Formatting Model
- - The CSS Box Model
- • IE/Win and the box model
- • Margin collapsing
- - Positioning
- • Visual Formatting model
- • Relative positioning
- • Absolute positioning
- • Fixed positioning
- - Floating
|
- Unit 3: Background Images
- - Rounded-corner boxes
- • Fixed width
- • Flexible
- - Drop-shadows
- • Easy CSS drop shadows
- • Clagnut drop shadow
- • Fuzzy shadows
- - Fluid Images
|
- Unit 4: Image Replacement
- - Using bitmaps
- • Fahner method
- • Phark method
- • Gilder/Levin method
- - Using Flash
- • Inman Flash Replacement
- • Scaleable Inman Flash Replacement
|
- Unit 5: Advanced Link Styling
- - Fancy link underlines
- - Highlighting different types of links
- - Highlighting downloadable documents and feeds
- - Visited link styles
|
- Unit 6: Buttons and Rollovers
- - Simple rollovers
- - Image rollovers
- - Pixy-style rollovers
|
- Unit 7: Styling Lists and Navigation Bars
- - Basic list styling
- - Creating a vertical navigation bar
- - Highlighting the current page in a nav bar
- - Creating a horizontal navigation bar
|
- Unit 8: More Complex Navigation
- - CSS Tabs
- - CSS image maps
- - Dropdown menus
|
- Unit 9: Advanced Layout
- - Centering a design
- • Using positioning
- • Using negative margins
- - Float-based layouts
- • Two-column layout
- • Three-column layout
- - Liquid and elastic layouts
- - Faux columns
|
- Unit 10: Introduction to hacks and filters
- - Using hacks sensibly
- - Filtering separate stylesheets
- • Internet Explorer conditional comments
- • Band pass filters
- - Applying IE conditional comments
|
- Unit 11: Filtering individual rules and declarations
- - Child selector hack
- - Attribute selector hack
- - Star HTML (* HTML) hack
- - Escaped property hack
- - Tantek's box model hack
- - Modified simplified box model hack
- - The important and underscore hacks
- - Owen hack
|
- Unit 12: Bugs and Bug Fixing
- - A systematic approach to bug hunting
- - Recognizing common CSS problems
- • Specificity and sort order
- • Margin collapsing
- - Bug hunting basics
- • Isolate the problem
- • Create a minimal test case
- • Fix the problem, not the symptoms
- • Ask for help
- - Understanding IE's rendering engine
- • What is "layout"?
- • What is the effect of "having layout"?
- - Common bugs and their fixes
- • Double-margin float bug
- • Three-pixel text jog bug
- • IE6 duplicate character bug
- • IE6 peek-a-boo bug
- • Absolute positioning within a relative container
|
