Define a: Link/A: visited/A: hover/A: active sequence (lvha) in CSS)

I have never encountered this problem with CSS before. I recently gave it to an undergraduate project. Some problems occurred. Search Engines checked some websites and materials and found that many people asked this question. I tried the results and most of them were incorrect. The sequence of my tests may be helpful to you: A: link {
Color: #000000;
Text-Decoration: None
}
A: visited {
Color: #000000; text-Decoration: None
} A: hover {
Color: # ff7f24;
Text-Decoration: underline;
} A: Active {
Color: # ff7f24;
Text-Decoration: underline;
} Today, I saw an anonymous friend's question and checked some information. This person spoke very well: from the eyes of the spirit ● The first furnace of Shen Xiang Blog A: Link,: hover, A: visited, which defines Sequence Different results may also lead to different link display effects.
I think the reason is that the browser follows the "proximity principle" when interpreting CSS ".

For example:
I want to set the color of the unaccessed link to blue, the activity link to green, and the accessed link to Red:

• First case: the sequence I defined is a: visited, A: hover, And A: link. At this time, you will find that when you place the mouse over a blue link that has not been accessed, it does not turn green. The link turns green only when it is placed on the accessed red link.
• The second case: I adjusted the CSS definition sequence to A: Link, A: visited, and a: hover. At this time, no matter whether the link you clicked has been accessed, it turns green.

This is because,The unaccessed link with a mouse has two attributes: A: link and a: hover.In the first case, a: link is closest to it, so it first satisfies a: link and does not give up the repeated definition of a: hover.
In the second case, whether the link has been accessed or not, it must first check whether it complies with the: hover standard (that is, whether there is a mouse passing through it). If yes, it turns green, if the condition is not met, the search continues until the definition that meets the condition is found.

One sentence:In CSS, if the same element is defined for different conditions, you should put the most general conditions on the top and go down in sequence to ensure that the bottom is the most special condition..
In this way, when the browser displays elements, it will verify the conditions from special to general, step-by-step, so that each of your CSS statements will have an effect.
Of course, if you deliberately disrupt the order, it will also produce some special results. For example, you can create the differences between the underline color and the text color for the link.

recently, it was suddenly discovered that this CSS problem had already been raised by some people. A foreigner. He summed up a memorable " love and hate principles " ( L O v E/ H A Te), the first letter of the four pseudo classes: lvha.
repeat the correct sequence: A: Link, A: visited, A: hover, A: active.