HTML5 and Advanced CSS3

Overview/Description
Target Audience
Prerequisites
Expected Duration
Lesson Objectives
Course Number
Expertise Level

---

Overview/Description
CSS3 provides a rich environment for manipulating images and text using animation and transforms. CSS3 with HTML5 can accomplish many graphical transforms and animations that used to require Javascript or other third party libraries. In this course, you'll learn to work with different transforms and animations provided by CSS3; for example, to rotate, skew, and scale HTML5 objects.

Target Audience
Web designers at all levels who need or want to use the advanced animation and transformation techniques of CSS3 in HTML5 documents

Prerequisites
None

Expected Duration (hours)
2.6

Lesson Objectives

HTML5 and Advanced CSS3

start the course

apply a transform to rotate an object in an HTML5 document

distort an object using the transform matrix in an HTML5 document

describe how to apply a 3D transformation to an object in an HTML5 document

use a transform to position an object in HTML5

add scaling to an object using a transform in HTML5

apply a transform to skew an object in HTML5

use a transform to add a perspective to an object in an HTML5 document

describe how to use CSS3 to create an animation in HTML5

create an animated picture using CSS3 in an HTML5 document

describe how CSS3 animation keyframes are used in HTML5

cycle the color of a div using CSS3 animation in an HTML5 document

rotate objects using CSS3 animation in an HTML5 document

describe some of the advanced CSS3 animation techniques available in HTML5

use CSS3 to change a web site's background color in an HTML5 document

use CSS3 to change a web site's background image in an HTML5 document

describe how to use CSS3 styles to modify background images in an HTML5 document

apply CSS3 styles to create columns and flow text in an HTML5 document

describe how and when to use image alignment in HTML5

describe CSS3 pseudo selectors in HTML5

apply CSS3 pseudo selectors to an HTML5 document

use CSS3 drop shadows in an HTML5 document

apply CSS3 linear gradients in an HTML5 document

create radial gradients in CSS3 in an HTML5 document

create gradient text using CSS3 in an HTML5 document

add transparency to objects in HTML5 using CSS3

use CSS3 to change the range slider style in an HTML5 document

draw triangles using CSS3 in HTML5

demonstrate how to programmatically apply CSS3 transitions and animations, 2D and 3D transforms

Course Number:
wd_htme_a07_it_enus

Expertise Level
Intermediate