In CSS, the color
property is used to set the color of text. You can specify the color using different formats, such as named colors, HEX values, RGB values, RGBA values, HSL values, and HSLA values. Here’s a detailed guide on how to use the color
property to style text:
Syntax
color: value;
Color Format values
1. Named Colors:
p {
color: red;
}
2. HEX Values:
p {
color: #ff0000;
}
3. RGB Values:
p {
color: rgb(255, 0, 0);
}
4. RGBA Values:
p {
color: rgba(255, 0, 0, 0.5); /* The last value is the alpha (opacity) */
}
5. HSL Values:
p {
color: hsl(0, 100%, 50%);
}
6. HSLA Values:
p {
color: hsla(0, 100%, 50%, 0.5); /* The last value is the alpha (opacity) */
}
Example: Basic Example with Named Colors
<!DOCTYPE html>
<html lang="en">
<head>
<style>
p {
color: blue;
}
</style>
</head>
<body>
<p>This is a paragraph with blue text.</p>
</body>
</html>
This is a paragraph with blue text.