CSS can make your web pages look amazing! Below are some commonly used styles that will help you bring your designs to life. Let’s dive in! 🚀

1. Text Styling ✍️

A. Text Transformations ✨

Control the appearance of text easily:

text-transform: uppercase;   /* Converts text to UPPERCASE */
text-transform: lowercase;   /* Converts text to lowercase */
text-transform: capitalize;  /* Capitalizes the first letter of each word */

Example:

<p style="text-transform: capitalize;">hello world!</p>
<!-- Output: Hello World! -->

B. Text Shadows 🌟

Add cool shadows to text for a stylish effect:

text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);

Example:

<h1 style="text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);">
  Glowing Text
</h1>

C. Line Spacing 📏

Control the vertical space between lines of text:

line-height: 1.5; /* 1.5 times the font size */