CSS Texts - Color, Alignment, Decoration, transformation, Spacing - letter-spacing, text-indent, line-height

• Text Color:
• Text Alignment:
• Text Decoration:
• Text Transformation:
• Spacing:
• Text Indent:
• Line Height:

Text formatting in HTML and CSS allows you to control the color, alignment, decoration, transformation, and spacing of text on a web page. Here are some examples of how you can apply these text styles:

¶Text Color:

You can set the color of your text using the CSS color property.

<style>
  .red-text {
    color: red;
  }
</style>
<p class="red-text">This is red text.</p>

¶Text Alignment:

You can align text within an element using the text-align property in CSS.

<style>
  .center-align {
    text-align: center;
  }
</style>
<p class="center-align">This text is centered.</p>

¶Text Decoration:

Text decoration includes properties like text-decoration: underline for underlining text, text-decoration: overline for adding a line above text, and text-decoration: line-through for striking through text.

<style>
  .underlined {
    text-decoration: underline;
  }
</style>
<p class="underlined">This text is underlined.</p>

¶Text Transformation:

You can transform text to uppercase, lowercase, or capitalize using the text-transform property.

<style>
  .uppercase {
    text-transform: uppercase;
  }
</style>
<p class="uppercase">This text is in uppercase.</p>

¶Spacing:

Letter Spacing:

You can control the spacing between letters using the letter-spacing property.

<style>
  .spaced-text {
    letter-spacing: 2px;
  }
</style>
<p class="spaced-text">Letter spacing increased.</p>

¶Text Indent:

You can set the indentation of the first line of text in a paragraph using the text-indent property.

<style>
  .indented-text {
    text-indent: 20px;
  }
</style>
<p class="indented-text">This text has an indentation of 20px for the first line.</p>

¶Line Height:

You can adjust the spacing between lines of text using the line-height property.

<style>
  .spaced-lines {
    line-height: 1.5;
  }
</style>
<p class="spaced-lines">This text has increased line height.</p>

These are just a few examples of how you can style text using CSS