0% found this document useful (0 votes)
3 views4 pages

Css 2

The document provides an overview of various CSS properties related to text styling, including color, alignment, decoration, transformation, indentation, letter-spacing, line-height, text-shadow, vertical alignment, white-space, and word-spacing. Each property is accompanied by examples demonstrating its usage. The document serves as a reference for applying text styles in web design using CSS.

Uploaded by

Arup Medhi
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)
3 views4 pages

Css 2

The document provides an overview of various CSS properties related to text styling, including color, alignment, decoration, transformation, indentation, letter-spacing, line-height, text-shadow, vertical alignment, white-space, and word-spacing. Each property is accompanied by examples demonstrating its usage. The document serves as a reference for applying text styles in web design using CSS.

Uploaded by

Arup Medhi
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 Color

The color property is used to set the color of the text. With CSS, a color is most
often specified by:

 a HEX value - like "#ff0000"


 an RGB value - like "rgb(255,0,0)"
 a color name - like "red"

Example:-

body { color: blue;


}

h1 {
color: #00ff00;
}

h2 {
color: rgb(255,0,0);
}

Text Alignment

The text-align property is used to set the horizontal alignment of a text. Text can
be centered, or aligned to the left or right, or justified.

Example

h1 {
text-align: center;
}

h2 {
text-align: right;
}

h3 {
text-align: justify;
}
Text Decoration

The text-decoration property is used to set or remove decorations from text.

Example

a{
text-decoration: none;
}

h1 {
text-decoration: overline;
}

h2 {
text-decoration: line-through;
}

h3 {
text-decoration: underline;
}

Text Transformation

The text-transform property is used to specify uppercase and lowercase letters in a


text. It can be used to turn everything into uppercase or lowercase letters, or
capitalize the first letter of each word.

Example

[Link] {
text-transform: uppercase;
}

[Link] {
text-transform: lowercase;
}

[Link] {
text-transform: capitalize;
}
Text Indentation

The text-indent property is used to specify the indentation of the first line of a text.

Example:-

p{
text-indent: 50px;
}

CSS letter-spacing Property


It is used to Increases or decreases the space between characters in a text.

Example

h1 {
letter-spacing: 2px;
}

h2 {
letter-spacing: -3px;
}

CSS line-height Property


The line-height property specifies the line height.

Example

[Link] {
line-height: 90%;
}

[Link] {
line-height: 200%;
}

CSS text-shadow Property


The text-shadow property adds shadow to text.

Example

h1 {
text-shadow: 2px 2px #ff0000;
}
CSS vertical-align Property
The vertical-align property sets the vertical alignment of an element.

Example:-

img {
vertical-align: text-top; (or vertical-align: text-bottom; )
}

CSS white-space Property


Specifies how white-space inside an element is handled

Example

/* Specify that the text in <p> elements will never wrap */

p{
white-space: nowrap;
}

CSS word-spacing Property


Increases or decreases the space between words in a text.

Example

p{
word-spacing: 30px;
}

Note: Negative values are allowed.

You might also like