CSS Bootcamp: Master CSS (Including CSS Grid/Flexbox) - Shadows

This video tutorial covers the use of shadows in CSS, focusing on text and box shadows. It explains how to apply text shadows with properties like horizontal and vertical positioning, blur, and color. The tutorial also demonstrates box shadow properties through a practical example of creating a card with hover effects. The video concludes with a summary of the benefits of using shadows to enhance web design.

What is the primary purpose of the text-shadow property in CSS?

• To change the text color

• To change the font style

• To add a shadow effect to text

• To align text to the center

What happens when you use negative values in the text-shadow property?

• The shadow moves in the opposite direction

• The text becomes bold

• The shadow becomes invisible

• The shadow color changes

Which value in the text-shadow property controls the blur effect?

• The first value

• The second value

• The color value

• The third value

How does the box-shadow property differ from the text-shadow property?

• Box-shadow is used for boxes, while text-shadow is for text

• Box-shadow only works with images

• Box-shadow is used for text, while text-shadow is for boxes

• Box-shadow does not support color changes

What is the default color of a box shadow in CSS?

• Gray

• White

• Black

• Transparent

Which CSS property can enhance the hover effect of a box shadow?

• Font-size

• Margin

• Padding

• Transition

In the context of box shadows, what does the hover effect achieve?

• It removes the shadow

• It changes the text color

• It changes the background color

• It animates the shadow