Skip to content

class14.md

Latest commit

 

History

History
46 lines (24 loc) · 2.4 KB

class14.md

File metadata and controls

46 lines (24 loc) · 2.4 KB

Class 14 Reading Assignment

CSS Transforms

  1. What does a CSS transform allow the developer to do to an element?

    • Two-dimensional transforms work on the x and y axes, known as horizontal and vertical axes. Three-dimensional transforms work on both the x and y axes, as well as the z axis. These three-dimensional transforms help define not only the length and width of an element, but also the depth.

  2. Provide an example of a CSS transform and how you could see that being used on a website:

2D transform with the rotate value provides the ability to rotate the element from 0 to 360 degrees. If a positive element is used, it rotates clockwise. If a negative element is used, it rotates counter-clockwise.

CSS Transitions and Animations

  1. What does a CSS transition allow the developer to do to an element?

With CSS3 transitions you have the potential to alter the appearance and behavior of an element whenever a state change occurs, such as when it is hovered over, focused on, active, or targeted.

  1. How does a CSS animation differ from a CSS transition?

Animations within CSS3 allow the appearance and behavior of an element to be altered in multiple keyframes. Transitions provide a change from one state to another, while animations can set multiple points of transition upon different keyframes.

8 Simple CSS3 Transitions That Will Wow Your Users

  1. What are some benefits to using CSS transitions on websites?

Just a couple of lines of code will give you an awesome transition effect that will excite your users, increase engagement and ultimately, when used well, increase your conversions.

  1. How does this topic fit in with your long-term goals?

I'm a big fan of making my projects look appealing. I can use these to really spruce up my projects while simultaneously furthering my skill as a software developer.

Bookmark/Skim