COAP:COAP-3000/week3

Draft

Week 3 topics - Some cool CSS

Learning goals

• Create and position CSS boxes (recall)
• Create CSS transforms

Understanding that every element in a web page is rectangular box is the starting point for creating fancy layouts, transforms and animations. Any box can be styled, transformed and animated over time.

CSS3 transforms allow scaling, moving, turning, distorting and rotating HTML elements. 2D transforms use "methods" like translate(), rotate(), skew() and scale(). 3D transform properties include translate3d, scale3d, rotateX, rotate and rotateZ. These properties then can be used to create animations with or without JavaScript programming.