Text transform utilities in Bootsrap - Cheat Sheet & Quick Revision

Recall & Review

beginner

What does the Bootstrap class .text-uppercase do?

It transforms all the text inside the element to uppercase letters, making every letter capital.

beginner

How does .text-lowercase affect text in Bootstrap?

It changes all the text inside the element to lowercase letters, making every letter small.

beginner

What is the effect of the Bootstrap class .text-capitalize?

It capitalizes the first letter of each word in the text inside the element.

intermediate

Can Bootstrap text transform utilities be combined with other utility classes?

Yes, you can combine text transform classes with color, spacing, and other utilities to style text easily.

beginner

Why use Bootstrap text transform utilities instead of writing custom CSS?

They save time by providing ready-to-use classes that work consistently across browsers and help keep code clean.

Which Bootstrap class makes all text uppercase?

A .text-bold

B .text-lowercase

C .text-capitalize

D .text-uppercase

The class .text-uppercase converts all letters to uppercase.

What does the class .text-capitalize do?

A Makes all text lowercase

B Makes all text uppercase

C Capitalizes the first letter of each word

D Makes text italic

It capitalizes the first letter of each word in the text.

If you want all letters to be small, which class should you use?

A .text-lowercase

B .text-uppercase

C .text-capitalize

D .text-muted

The class .text-lowercase converts all letters to lowercase.

Can you use text transform utilities with other Bootstrap classes?

A No, they must be used alone

B Yes, they can be combined with other utility classes

C Only with color classes

D Only with spacing classes

Text transform utilities can be combined with any other Bootstrap utility classes.

What is a benefit of using Bootstrap text transform utilities?

A They provide quick, consistent text styling without extra CSS

B They only work in Chrome

C They automatically translate text

D They require writing custom CSS

Bootstrap utilities provide quick and consistent styling without needing custom CSS.

Explain how Bootstrap text transform utilities help in styling text on a webpage.

Think about how these classes change the look of text and save time.

Describe a real-life example where you would use .text-uppercase and .text-capitalize classes.

Imagine styling a website header and user names.