Link Color

Using HTML, you can set the colors of all links on the page, and also change the colors for individual links.

Set the color of all links on the page

Links colors are specified as parameters of the <BODY> tag. The parameters are optional and if they are not specified, the default values ​​are used.

LINK - defines the color of the links on the web page (the default color is blue, # 0000FF).
ALINK - the color of the active link. The color of the link changes when the mouse button is pressed on it. The default color is red, # FF0000.
VLINK is the color of the links already visited. The default color is purple, # 800080.

In HTML, colors are usually set in digits in hex code, in the form #RRGGBB, where R, G and B denote the red, green and blue components, respectively. For each color, a hexadecimal value from 00 to FF is specified, which corresponds to a range from 0 to 255 in decimal. Then these values ​​are combined into a single number, preceded by the symbol # (example 1).

Example 1. Setting Reference Colors

Valid HTML
<! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 Transitional // EN" "http://www.w3.org/TR/html4/loose.dtd">
<Html>
<Head>
<Meta http-equiv = "Content-Type" content = "text / html; charset = windows-1251">
<Title> Link Color </ title>
</ Head>
<Body link = "red" vlink = "# cecece" alink = "# ff0000" bgcolor = "black">

<P> <a href="content.html"> Site content </a> </ p>

</ Body>
</ Html>

Color does not have to be specified in hexadecimal format, you can use keywords. In this example, the background color of the web page is set to black, and the color of the links is red.

Comment

Parameter values ​​are case insensitive, so it is correct to write both #FFFFFF and #ffffff.

To change the color of links it is more convenient to use CSS. To set the color for all links on a web page, the following pseudo-classes are applied, which are added to the selector A.

Visited - Style for the visited link.
Active - The style for the active link. Active link becomes when you click on it.
Hover - The style for the link when hovering over it with the mouse.

Example 2 shows how to change the color of links on a web page using styles. To do this, we use the style parameter color , it specifies the color of a certain text, in this case, links.

Example 2. Color of links given through styles

Valid HTML
Valid CSS
<! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 // EN" "http://www.w3.org/TR/html4/strict.dtd">
<Html>
<Head>
<Meta http-equiv = "Content-Type" content = "text / html; charset = windows-1251">
<Title> Using Styles </ title>
<Style type = "text / css">
BODY {
Background: black; / * Web page background color * /
}
A {
Color: red; / * Link color * /
}
A: {
Color: #cecece; / * The color of the visited links * /
}
A: active {
Color: # ffff00; / * Color of active links * /
}
</ Style>
</ Head>
<Body>

<P> <a href="content.html"> Site content </a> </ p>

</ Body>
</ Html>

Specifying the color of individual links on the page

The above method of specifying colors works for all links of a web page. However, sometimes it becomes necessary to use different colors at the same time. Light, for example, for dark areas of a web page, and dark colors - respectively for light ones. You can also use the styles for this.

To change the color of the link, use the style = "color: #rrggbb" parameter in the <A> tag, where #rrggbb is the color in the hexadecimal representation. You can also use color names or specify a color in the format: rgb (132, 33, 65) . The parentheses indicate the red, green and blue decimal values ​​(example 3).

Example 3: Changing the color of a link using styles

Valid HTML
<! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 Transitional // EN" "http://www.w3.org/TR/html4/loose.dtd">
<Html>
<Head>
<Meta http-equiv = "Content-Type" content = "text / html; charset = windows-1251">
<Title> Link Color </ title>
</ Head>
<Body link = "# ffcc00" vlink = "# cecece" alink = "# ff0000" bgcolor = "black">

<P> <a href="content.html" style="color: white"> Site content </a> </ p>
<P> <a href="im.html" style="color: #ffffff"> Internet Marketing </a> </ p>
<P> <a href="use.html" style="color: rgb (255,255,255)"> Usability </a> </ p>

</ Body>
</ Html>

In this example, there are three different ways to specify colors using styles.

Copyright © www.htmlbook.ru