Bright design of your site is the key to attracting the constant attention of page visitors and increasing conversion. Correctly selected gamut of colors will affect, among other things, the reader’s perception of information. This is not only about the background colors or individual elements of the web page, but also to a greater extent the color of the text posted on the site.
Using CSS to style your site
To design an HTML document and change text settings, it uses CSS (Cascading Style Sheet - cascading style sheets).
To make adjustments to the color of HTML text in earlier versions, you could use the <font> ... </font> tag. After the release of HTML5, programmers and site owners for these purposes began to use only CSS. This meets all standards and you will not have to worry about how the site will be displayed in different browsers.
You can make text color changes in HTML using CSS in several ways:
- using the HEX mode: color: # 0000ff;
- using the word for the desired color (in English): color: blue.
Directly incorporate CSS into an HTML document
The use of the style attribute to change the color of text in HTML code is illustrated by an example.
Paste this code into the editor, which you usually use to write HTML-code, the text will be painted in the colors that we consider below.
The beginning of any new HTML document is as follows:
<! DOCTYPE html>
<html>
<head>
<h2> Change the text color in HTML </h2>
</head>
<body>
<h1> By default, the text color of the page content is black. Of course, if the additional tags do not specify a different design. </h1>
<h2 style = "color: # 0000ff"> Enabling the style attribute (style = "hex color or the color specified by the word") with a specific color value will change the color of the text according to your wishes. The text for this heading is blue. </h2>
<p style = "color: # 008000"> In the previous paragraph and in this case, we set the text color in HEX mode, which is a hexadecimal number system. Colors are encrypted in combinations of numbers from 0 to 9 and Latin letters from a to f. The color of this text is green. </p>
<p style = "color: # ff0000"> You do not need to remember color numbers. There is a color table in HEX format. It is very easy to find it by writing a corresponding request in the search engine. This paragraph on the site will be colored red. </p>
<p style = "color: brown"> It is easier to identify the color of the text with the English word. The text color in this example is brown. Primary colors are easy to recognize and remember. Also, any site for learning English will tell you the right words. </p>
<p style = "color: # 4B0082"> The use of colors in hex format is necessary if you need to change the color of an unapproved hue. Here we applied the Indigo color according to the color chart. </p>
</body>
</html>
The application of the method described above is justified if it is necessary to change the text color of several lines or paragraphs, that is, not to scale.
Connecting CSS to the <head> section
In order to set a general color for the page text other than black, the style tag should be used independently within the paired <head> ... </head> tag.
This method is convenient for beginners to use, as well as for small-page sites.
The following is an example of markup in which all styles (including changing the color of the text of an HTML document) placed inside the tag tag pair <style> ... </style> will be applied to the entire document if inside the pair tag <body>. .. </body> no additional parameters have been set.
<! DOCTYPE html>
<html>
<head>
<style>
body {
color: green;
}
</style>
</head>
<body> Thus, by specifically setting the color of the main part of the document, this text will be painted in green (green).
</body>
</html>
The above examples of how you can change the color of text in HTML will allow you to easily choose the design for your site and diversify its color scheme.