The most commonly used CSS color attribute (Cascading Style Sheets) to change the color of hyperlinks in web pages. Less functional solutions to this problem are in the HTML language (HyperText Markup Language - "hypertext markup language").
It is necessary
Basic knowledge of HTML and CSS languages
Instructions
Step 1
Prepare a styling block for hyperlinks. In its simplest form, it might look something like this: a {color: Green} Here "a" is called a "selector", which indicates that the style description in parentheses should be applied to all link tags in the document. Green defines the color of the link; this is a very rough definition of color and is rarely used. Much more often, a "pseudo-class" is added to the "a" selector - it is a label that allows you to specify the link style in three different states.
Step 2
Use the link pseudo-class to style the normal (inactive) state of the link. It may look like this, for example: a: link {color: Green}
Step 3
Use the pseudo-class hover to specify how the link should appear on hover. For example: a: hover {color: Lime}
Step 4
Use the visited pseudo-class to describe the style of an already visited link. For example: a: visited {color: DarkGreen}
Step 5
Combine all three states into one style block. The look of HTML code containing CSS descriptions of styles can, for example, look like this:
a: link {color: Green}
a: visited {color: DarkGreen}
a: hover {color: Lime}
Here, the opening and closing HTML style tags tell the browser where style descriptions begin and end, and between them is a description of the link behavior in three states.
Step 6
The sample used above shows only the color characteristics, but other attributes can be included in the description. For example, if the design of the page requires that in the normal (inactive) state the link should not be underlined, but underlined on hover, then the code can be modified as follows:
a: link {color: Green; text-decoration: none;}
a: visited {color: DarkGreen; text-decoration: none;}
a: hover {color: Lime; text-decoration: underline;}
Step 7
If you want to change the color of only some links in the page, and leave the rest with the default settings, then add the class attribute to the tag of each link being changed. For example, name this hyperlink class newLinks. Then the link tag may look like this: text link The same class name must be added to the style description:
a.newLinks: link {color: Green; text-decoration: none;}
a.newLinks: visited {color: DarkGreen; text-decoration: none;}
a.newLinks: hover {color: Lime; text-decoration: underline;}
Step 8
Place the style description code prepared based on the examples described above in the header part of the page - between the and tags. If necessary, add a class attribute to the link tags with the name used in the style descriptions. Then save the modified page and the procedure for changing the color of the hyperlinks will be completed.
