Free Web Design, Development and Programming Training and Tutorial Resources




    



October 12, 2009

CSS 2.0 Tutorial

Here is a CSS Tutorial, at New Mexico Tech Computer Center, that will help you with styling web pages and sites using CSS 2.0. This tutorial acts as a reference guide for Cascading Style Sheets 2.0, which is used for describing the style, layout, etc. of Web pages. In this CSS tutorial you will learn how to use CSS to control the style and layout of multiple Web pages all at once. It contains everything that is required for you to master CSS 2.0. This CSS tutorial also can be downloaded as a pdf.


Tutorial on Styling Web Pages with CSS 2.0:

  What are Cascading Style Sheets and why should you use them?
  Connecting your page to a style sheet
  Overall structure of a style sheet
  At-rules
  How to write CSS rules
  Common value types in CSS
     - Dimensions
     - Specifying colors
     - String constants
     - Universal resource identifiers (URIs)
     - Counters
     - Specifying angles
     - Times
     - Frequencies
  Selectors
     - Element type selectors
     - Selecting elements by class
     - Selecting elements by their context
     - Child selection
     - Adjacent element selection
     - Selecting by attribute values
     - Selecting specific single elements by ID
     - Pseudo-classes
     - Pseudo-elements
     - The universal selector -When rules collide
     - Cascading
     - Specificity: Which selector applies?
     - Inheritance
  Declarations
  Font properties
     - The font-family property
     - The font-style property
     - The font-variant property
     - The font-weight property
     - The font-size property
     - The font property
  The display property: What kind of box is this?
  Other text properties
     - The line-height property
     - The text-indent property
     - The text-align property
     - The text-decoration property
     - The text-transform property
     - The white-space property
     - The letter-spacing property
     - The word-spacing property
     - The vertical-align property: Shifting the baseline
     - The quotes property: Specifying quote characters
  The color property
  The background properties
  Designing with box elements
     - Side lists
     - The height and width properties
     - The clear property
     - The float property
     - The padding properties
     - The border properties
     - The margin properties
     - The overflow property: What if it doesn’t fit?
     - The clip property: Specify a clipping rectangle
     - The visibility property: Can we see the content?
     - The position property: Positioning boxes
     - The box offset properties: top, bottom, left, and right
     - The z-index property: Stacking order
  The content property: Specifying content in pseudo-elements
     - The counter-reset property
     - The counter-increment property
  The list properties
     - The list-style-type property
     - The list-style-image property
     - The list-style-position property
     - The list-style property
     - The marker-offset property
  Tables
     - Table column properties
     - How table size is computed
     - Table border properties
     - The speak-header property: Aural rendering of tables
  User interface options
     - The cursor property
     - Selecting colors to match UI components
     - Dynamic outlines
  Aural stylesheets
     - Spatial presentation: the azimuth property
     - Voice properties
     - The volume property
     - The speak, speak-punctuation , and speak-numeral properties: spelling it
     - General voice qualities: voice-family, pitch, pitch-range, stress, and richness
     - Timing properties: speech-rate, pause-before, pause-after, and pause
     - Element cues: cue-before, cue-after, and cue
     - Audio mixing: play-during
  The @import rule: Importing another stylesheet
  The @media rule: Tuning for different rendering platforms
     - Media types
  The @page rule: Paged media
     - The size property for paged media
     - Controlling page breaks
     - Orphan control
     - Widow control
     - Crop marks and alignment targets: the marks property
     - The page attribute: Selecting a page type





Tags for this post>>

No Comments »

No comments yet.

RSS feed for comments on this post.

Leave a comment

You must be logged in to post a comment.