w3resource

CSS Properties: How to specify the text color?

Go to Exercise page

Solution:

HTML Code:

<!DOCTYPE html><!-- Specifies the document type and version of HTML -->
<html>
<head>
<title>How to specify the text color</title><!-- Sets the title of the HTML document -->
<style type="text/css"> /* Begins a CSS style block */
div {
    color:#3333FF; /* Sets the text color for all div elements to a shade of blue */
}
h1 {
color: #FF0000; /* Sets the text color for all h1 elements to red */
}
</style><!-- Ends the CSS style block -->
</head>
<body>
<h1>w3resource Tutorial</h1><!-- Inserts an h1 element with the text "w3resource Tutorial" -->
<div>CSS, stands for Cascading Style Sheet is a computer language to describe presentation of HTML and XML web documents.</div><!-- Inserts a div element with text describing CSS -->
</body>
</html>

Explanation:

  • This HTML document demonstrates how to specify text color for different elements using CSS.
  • The CSS style block defines rules for the div and h1 elements.
  • The text color for all div elements is set to a shade of blue (#3333FF) using the color property.
  • The text color for all h1 elements is set to red (#FF0000) using the color property.
  • The HTML body contains an h1 element with the text "w3resource Tutorial" and a div element with text describing CSS.
  • The text color of the h1 element will appear as red, while the text color of the div element will appear as blue, as defined by the CSS rules.

Live Demo:

See the Pen color-color-answer by w3resource (@w3resource) on CodePen.


See the solution in the browser

Supported browser

Firefox logo Chrome logo Opera logo Safari logo Internet Explorer logo
Yes Yes Yes Yes Yes

Go to Exercise page

What is the difficulty level of this exercise?

Test your Programming skills with w3resource's quiz.



Follow us on Facebook and Twitter for latest update.