Carousel captions in Bootsrap - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is the purpose of carousel captions in Bootstrap?

Carousel captions provide text overlays on carousel images to describe or add context to each slide. They help users understand the content shown.

beginner

Which Bootstrap class is used to add captions inside a carousel item?

The class .carousel-caption is used to add captions inside a carousel item. It positions text over the image with proper styling.

intermediate

How do you make carousel captions accessible for screen readers?

Use semantic HTML tags like <h5> for titles and <p> for descriptions inside .carousel-caption. Also ensure good color contrast and readable font size.

intermediate

Can carousel captions contain HTML elements like links or buttons?

Yes, carousel captions can contain HTML elements such as links, buttons, or formatted text to make captions interactive or styled.

advanced

What CSS positioning does Bootstrap use for carousel captions by default?

Bootstrap uses absolute positioning for .carousel-caption to place captions at the bottom center of the carousel item by default.

Which class adds captions inside a Bootstrap carousel slide?

A .carousel-caption

B .carousel-text

C .caption-slide

D .slide-caption

The correct class to add captions inside a carousel slide is .carousel-caption.

Where are carousel captions positioned by default in Bootstrap?

A Top left

B Bottom center

C Center middle

D Top right

Bootstrap positions carousel captions at the bottom center of the slide by default.

Which HTML tag is best for the main title inside a carousel caption?

A <h5>

B <footer>

C <span>

D <div>

Using a heading tag like

inside carousel captions improves accessibility and structure.

Can you include clickable links inside carousel captions?

A Only plain text

B No

C Only images

D Yes

Carousel captions can contain any HTML, including clickable links and buttons.

What is important for carousel caption accessibility?

A Using bright colors only

B Only large fonts

C Good color contrast and semantic HTML

D No text at all

Good color contrast and semantic HTML tags help make carousel captions accessible to all users.

Explain how to add and style captions in a Bootstrap carousel.

Think about the HTML structure and default styling Bootstrap provides.

Describe accessibility best practices for carousel captions.

Focus on how captions help all users, including those using screen readers.