The emphasis on this section deals with those CSS-3 aspects we can use today (in multiple browsers). Yes, I have included the browser specific prefixes (be sure to view the source code). For most of the examples, I have included the CSS-3 directly with the HTML (as opposed to the best practice of a separate file). However, I want visitors to be able to view the source code and examine the details in one file. These examples will open in a new browser window/ tab. Many of these examples were generated after viewing various lynda.com tutorials on CSS-3. Obviously, they are modified from the training materials provided by lynda.com.

• CSS special effects (alphabetized)
  • CSS drop caps (works in most modern browsers)
  • CSS gradients (requires WebKit based browsers to experience full effect - Safari or Chrome, for example)
  • CSS keyframe animation (requires WebKit based browsers to experience full effect - Safari or Chrome, for example)
  • CSS masking (requires WebKit based browsers to experience full effect - Safari or Chrome, for example - however, somee effects only work in Safari)
  • CSS opacity
  • CSS reflections (requires WebKit based browsers to experience full effect - Safari or Chrome, for example)
  • CSS round corners
  • CSS shadows
  • CSS transformations
  • CSS transition example
  • More complex CSS transition example (including hover effect and onclick event handler)
  • Three Column Layout (only works in -webkit and -moz browsers)