Consulting Training Blog Careers About Us Contact Us

CSS3 for Web Designers and Developers Training

Upcoming Classes

Sorry, nothing scheduled right now. Click the Get Notified button below to be alerted when a class is scheduled.

Get Notified

On Site/Private

Can't find a class that fits right for you? Contact us to inquire about scheduling your own private class

Contact Us

Description

This CSS3 for Web Designers and Developers training class is intended for web designers and developers already familiar with cascading style sheets. People new to CSS should start with our Introduction to CSS and Advanced CSS courses.

This CSS3 course will expose students to new features in CSS3. Students will learn to leverage the power and efficiency of this most recent version of CSS, learning how to use new selectors and pseudo elements; new font, color, and layout techniques; transforms, transitions, and animations; media queries for presenting on mobile devices; and more.

Bring This Course To You

For groups of 5 or more, let Intertech bring this course to your location. Customized versions tailored towards your objectives are also available.

Learn More

Learning Objectives

  • Learn new selectors, pseudo class, and pseudo elements to style elements.
  • Learn font and text effects, including @font-face.
  • Learn new gradient, mask, and background image techniques.
  • Learn how to implement animations, transitions, and 2D and 3D transforms.
  • Learn how to use media queries to render content appropriately for mobile and tablet devices.
  • Learn about vendor-specific prefixes and browser support for various CSS3 techniques.

Prerequisites

Experience in the following areas is required:

  • HTML
  • Advanced level of CSS

Course Outline

The Power of CSS

  • Doing More with Less
  • A First Example
  • Challenges
  • Next Up

Introducing CSS3

  • What is CSS3?
  • The History of CSS
  • Browser Support
  • HTML5

Selectors and Pseudo Classes

  • Attribute Selectors
  • The Target Pseudo-Class
  • UI Element States Pseudo-Classes
  • Negation Pseudo-Class
  • Structural Pseudo-Classes

Fonts and Text Effects

  • Fonts on the Web
  • Font Services
  • The @font-face Rule
  • Text Shadow
  • Word Wrapping

Colors, Gradients, Background Images, and Masks

  • Color
  • The Opacity Property
  • Backgrounds
  • background-origin, and background-size

Borders and Box Effects

  • Image Borders
  • Rounded Corners
  • Box Shadow

Transitions, Transforms, and Animations

  • Transitions and Transforms
  • Transitions

Layout: Columns and Flexible Box

  • Layout: Columns and Flexible Box
  • Flexible Box Model
  • Vendor Prefixes

What Are Vendor Prefixes?

  • Maybe They Ain't So Bad
  • Strategies

Embedding Media

  • Video Formats
  • Styling Video

Accessibility Features

  • Web Accessibility
  • The CSS3 Speech Module

Media Queries

  • Targeting Widths and Devices with CSS3 Media Queries
  • Responsive Images and the viewport Metatag

Implementing CSS3 in the "Real World"

  • Stuff That Ain't (Strictly) CSS, but Sure Is Useful
  • jQuery
  • HTML5
  • Modernizr
  • Preprocessors
  • Frameworks and Grid Systems

Going Forward/Additional Resources

  • What's Next?
  • Online Resources
  • Get Involved

Free Resources from Intertech

Complete Guide to Becoming a Full Stack Developer

Free eBook: Top Freeware Picks for Developers

Free Whitepaper: Better JavaScript With Strict Mode And JSHint

X