# Knowledge check: CSS effects

1. **Which of the following properties is used to set the length of time in seconds for one iteration of animation in CSS?**
    
    * animation-delay
        
    * animation-timeline
        
    * <mark>animation-duration</mark>
        
    * animation-timing-function
        
2. **What are the benefits of using preprocessors such as SASS and SCSS? Select all that apply.**
    
    * <mark>They allow for re-use of values across CSS rules</mark>
        
    * <mark>They reduce the amount of CSS to maintain</mark>
        
    * <mark>They provide audit functionality</mark>
        
3. **The \_\_\_\_\_\_ suffix is used to define variables inside SCSS files used for CSS.**
    
    * #
        
    * No special characters are needed
        
    * @
        
    * <mark>$</mark>
        
4. **What styling property will you apply if you want to rotate an object 60 degrees in counter clockwise direction?**
    
    * rotate: -60deg
        
    * transform: rotate(60deg)
        
    * <mark>transform: rotate(-60deg)</mark>
        
    * rotate: 60deg
        
5. **You cannot apply more than one property inside a single ‘transform’ declaration rule in CSS.**
    
    * True
        
    * <mark>False</mark>
        
6. **Is this valid code for an animation-name ‘animate’?**
    
    ```css
    @keyframes animate {
         0% {
             transform: rotate(60deg) scale(0.8);
        }
         25% {
             transform: rotate(90deg) scale(1.2);
        }
    }
    ```
    
    * No, you cannot use the transform inside @keyframes
        
    * <mark>Yes, this should work fine</mark>
        
    * No, the animation transition is not fully defined