CSS Introduction & Intermediate - Philippines

CSS Introduction & Intermediate Course Outline

The following subjects will be taught during this course:

Introduction

• HTML structure and content
• Advantages of CSS
• Creating and using style sheets
• CSS Rules: The Basic Syntax

CSS Boxes and CSS Selectors

• The CSS box model
• CSS and logical HTML structure
• Styling boxes, borders, margins, and padding
• Using IE6 standards mode
• Specifying CSS distances
• and many other CSS techniques

Text Formatting in CSS

• Fundamentals of text formatting
• Typefaces, alternatives, and defaults
• Font characteristics
• Formatting blocks of text
• Using arbitrary inline tags

CSS Selectors and Selections

• Using HTML element IDs in CSS
• Using CSS descendant selectors
• Descendant selector examples
• Child, sibling, and pseudo-class selectors
• And many other CSS techniques.

CSS Positioning

• Choosing the right CSS
• Technique for positioning blocks
• The position property, floats, and margins
• Static positioning and normal flow
• Absolute positioning outside normal flow
• Fixed positioning outside normal flow

CSS Page Layout

• Alternative methods of CSS positioning
• Styling lists
• Redefining the behaviour of inline and block elements
• Table formatting in CSS
• Styling table cell borders
• Page layout with table display properties

Cascade, Precedence, Specificity, and Inheritance in CSS

• Cascading and cascade order
• Resolving style conflicts by Origin & Importance
• Resolving style conflicts by Specificity & Order

CSS Layers and Translucency

• Different forms of layered presentations in CSS
• Layering with the z-index property
• Different methods for creating translucency effects
• The CSS3 opacity property

Using CSS in the Real World

• Deploying CSS
• CSS formatting vs. HTML formatting
• Standard tags and semantic markup
• Screen size and fluid design
• Table layout and CSS positioning
• Cross-platform testing

CSS3 on Mobile Devices

• CSS3 media queries
• Varied sizes
• Orientation change

Fonts and Text

• Using custom fonts
• Font properties
• Web font formats
• Type Kit, font squirrel

Backward Compatibility Tools

• CSS3 Pie
• CSS3 Generators
• Transformice
• Modernizr
• Selectvizr

Useful CSS Tips

• Usage of CSS Sprites
• Pseudo Selectors
• CSS Minify
• Cheat Sheet for CSS3

Menus

• HoverBox image gallery
• Advanced CSS menu
• CSS3 Navigation and Menus
• CSS3 Toggle-button without JavaScript
• Create iOS back/forward buttons with CSS3