Teach with us

Setting Text Color using CSS

To set the text color, use the color property in CSS. You can set the color with the color name, hexadecimal value, RGB value, or using the HSL value.

Example

 Live Demo

<!DOCTYPE html>
<html>
<head>
<style>
span {
   background-color: orange;
   color: white;
}
p.demo {
   display: none;
}
span.demo1 {
   display: inline;
}
</style>
</head>
<body>
<h1>Match Details</h1>
<div>
Match will begin at <p class="demo">9AM</p> 10AM on 20th December.
</div>
<div>
Match will end at <span class="demo1">5PM</span> on 20th December.
</div>
</body>
</html>

Output

Example

Let us now see another example −

 Live Demo

<!DOCTYPE html>
<html>
<head>
<style>
p.demo1 {
   word-spacing: 1cm;
   color: #F8E61C;
}
p.demo2 {
   word-spacing: 40px;
}
</style>
</head>
<body>
<h1>Demo Heading</h1>
<h2>Heading2</h2>
<p class="demo1">This is demo text.</p>
<h2>Heading2</h2>
<p class="demo2">This is demo text.</p>
</body>
</html>

Output

Updated on 26-Dec-2019 11:18:43

0 Views

Tutorials Point

Previous Page Next Page  
Advertisements