2.3 KiB
title |
---|
Text |
Text
Several properties are provided by CSS to change the look and feel of the text. Various text properties are explained below.
Text Color
<html>
<body>
<p>This is an example of CSS text property.</p>
</body>
</html>
p {
color:red;
}
In the above example, the text color
of <p>
element is changed to red. You can also specify the color as RGB values, HLS values, and hex codes (For more information about colors, click here).
Text Alignment
text-align
property is used to set horizontal alignment of text. It can take values left
,right
,center
,and justify
.
p {
text-align: center;
}
Here the text is aligned to the center
(example).When text-align
is set to justify
,each line is stretched so that every line has equal width, and the left and right margins are straight (example).
Text Decoration
p {
text-decoration: underline;
}
The text-decoration
property is used to set or remove decorations from text. The value text-decoration: none;
is often used to remove underlines from links. Other text-decorations
include overline
,line-through
,and underline
(example).
Text Transformation
p {
text-transform: capitalize;
}
The text-transform
property is used to convert the entire text to uppercase
,lowercase
or to capitilize
each word(example).
Letter Spacing
The letter-spacing
property sets the space between characters in a text.
p {
letter-spacing: 5px;
}
Line Height
The line-height
property sets the space between two lines of text.
p {
line-height: 5px;
}
Word Spacing
The word-spacing
sets the space between words in a text.
p {
word-spacing: 5px;
}