CIW Lesson 4 (mastery course ?'s)
How can you define the position of an animation using the @keyframes rule?
By specifying a percentage from 0% to 100%, or by using the keywords "to" and "from"
Which animation property should you use to specify how long an animation will take to complete one cycle?
The animation-duration property
The animation-timing-function property of the @keyframes rule specifies:
how an animation progresses over one cycle.
What CSS3 2D transform method combines all of the 2D transform methods into one, which enables an element to rotate, scale, move (translate) and skew?
Matrix(n,n,n,n,n,n)
When you use the CSS3 transition property, you must specify the duration of the effect. If you do not specify the duration, which of the following will result?
No transition will occur.
Which CSS3 technique can you use to place an HTML element on top of another HTML element?
Overlay
What CSS3 2D and 3D transform method would you use to increase or decrease the size of an element?
Scale
What is required to create CSS3 animations?
The @keyframes rule
What is needed to provide coordinates in three-dimensional space to create a plane to help orient a 3D object?
The Z-axis
Which animation property should you use to specify the number of times that an animation will play?
The animation-iteration-count property
Which animation property should you use to specify whether an animation is running or paused?
The animation-play-state property
What happens when you assign a negative z-index value to an element?
The element will display behind other elements.
When you use the CSS3 opacity property, how do you specify the level of transparency to apply?
You specify a value between 0.0 and 1.0.
What CSS3 property should you use if you want to allow the user to control the dimensions of an element (such as the <div> element)?
The resize property
Which set of CSS3 properties can you use to alter the appearance or operation of a Web page?
The user interface properties
Which statement is true regarding CSS3 animations?
They were designed to replace basic animations that previously required third-party, proprietary plug-ins or the use of JavaScript.
Why would you use the CSS3 transform properties in a Web document?
To change the shape, size and/or position of an element
Why would you use the CSS3 opacity property when you overlap images or other elements in your Web page?
To make the foreground element partially transparent so elements in the background will be visible
What is the term for a CSS3 effect that allows elements to rotate, move, flip and stretch?
Transform
What is the term for a CSS3 effect that changes an element from one style to another style based on a user-triggered event?
Transition
What 2D and 3D transform method would you use to move an element from its current position?
Translate
When you want to create an overlay, how can you specify the stack order of an element?
Use the Z-index property.
Consider the following snippet of code: section { background-image: url(globe.png); background-repeat: no-repeat; background-size: contain; resize: both; overflow: auto; } What can you determine from this code?
You can resize both the height and width of the section element, including the globe background image.
The animation-direction property of the @keyframes rule specifies:
whether to play the animation in reverse on alternate cycles.
