1 - Text-align
This property allows you to define the alignment of a text.
Example:
// This code is used to align all the paragraphs to the right.
p {text-align: right; }
2 - Text-color
This is a property used to customize the color of the text
Example
// this example allows to write all the h1 tags in blue
h1 {color: blue; }
3 - Text-decoration
This command allows you to decorate a text with a line at the bottom, above, strikethrough ...
{text-decoration: value; }
- value = none : no decoration
- value = underline : underlined text
- value = overline : line above
- value = line-through : strikethrough text
- value = blink : blinking text (works with Mozilla and Netscape and not with Internet explorer)
4 - Text-indent
This is a property used to specify the offset of the first line of each paragraph. Example:
p {text-indent: 30px; }
5 - Letter-spacing
This property allows you to specify the spacing between characters.
Example:
// normal spacing between characters
p {letter-spacing: normal; }
Example:
// 3px spacing between characters
p {
letter-spacing: 3px;
}
6 - Line-height
This property is used to define the space between the lines of a paragraph Example:
p {line-height: 20px; }
7 - Text-shadow
This command allows you to decorate text with a shadow, the syntax is:
{
text-shadow: value1 value2 value3 color;
}Where :
- value1 : measures the offset of the shadow horizontally to the right in pixels
- value2 : measures the offset of the bottom shadow vertically in pixels
- value3 : measures the thickness of the shadow
- color : shade color Example:
p {
text-shadow: 7px 5px 3px black;
}Which displays after execution:
8 - Text-transform
This command allows you to modify the case of a text; its values are: lowercase: transforms all text into miniscule capitalize: transforms the first letter of each word into uppercase uppercase: transform all text to uppercase inherit: inherit from parents
Example
<html>
<head>
<style>
p {
text-transform: uppercase;
}
</style>
</head>
<body>
<p>
Here is an example of text converted to uppercase
using the text-transform CSS command
</p>
</body>
</html>
Which displays after execution:
my-courses.net
