0% found this document useful (0 votes)
7 views2 pages

CSS Text Properties Explained

The document outlines various CSS text properties that control text appearance and formatting on webpages. Key properties include text alignment, decoration, indentation, transformation, shadow, letter and word spacing, and line height, each with specific values and examples. These properties enable developers to customize text presentation effectively.

Uploaded by

logeshece
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
7 views2 pages

CSS Text Properties Explained

The document outlines various CSS text properties that control text appearance and formatting on webpages. Key properties include text alignment, decoration, indentation, transformation, shadow, letter and word spacing, and line height, each with specific values and examples. These properties enable developers to customize text presentation effectively.

Uploaded by

logeshece
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

<!-- !

Text Property -->

Text properties in CSS are used to control the appearance and formatting of
text on a webpage.
These properties allow you to modify various aspects of the text, such as its
color, size, spacing, alignment, decoration, and transformation.

Text Alignment:

text-align:

- Aligns the text within an element.


- Values: left, right, center, justify, start, end.

- Example: text-align: center;.

Text Decoration:

text-decoration:

- Specifies the decoration added to text.


- Values: none, underline, overline, line-through.

- Example: text-decoration: underline;.

text-decoration-line:

- Sets the type of text decoration.


- Values: none, underline, overline, line-through, blink.

- Example: text-decoration-line: line-through;.

text-decoration-color:

- Sets the color of the text decoration.


- Values: any color value (#ff0000, rgb(255, 0, 0), blue, etc.).

- Example: text-decoration-color: red;.

text-decoration-style:

- Sets the style of the text decoration.


- Values: solid, double, dotted, dashed, wavy.

- Example: text-decoration-style: dashed;.


Text Indentation:

text-indent:

- Specifies the indentation of the first line in a text block.


- Values: length values (px, em, %, etc.).

- Example: text-indent: 20px;.

Text Transformation:

text-transform:
- Controls the capitalization of text.
- Values: none, capitalize, uppercase, lowercase.

- Example: text-transform: uppercase;.

Text Shadow:

text-shadow:
- Adds shadow to text.
- Values: none or a combination of h-shadow, v-shadow, blur-radius, and
color.

- Example: text-shadow: 2px 2px 5px gray;.

Letter and Word Spacing:

letter-spacing:
- Sets the spacing between characters.
- Values: length values (px, em, etc.).

- Example: letter-spacing: 2px;.

word-spacing:
- Sets the spacing between words.
- Values: length values (px, em, etc.).

- Example: word-spacing: 4px;.

line-height:
- The line-height property is used to specify the space between lines:
- A line height of 1.5 means the space between lines is 1.5 times the font
size.

- Example: line-height: 0.8;

You might also like