Why "a: hover MUST come after: link and a: visited (w3school)"?

I learn CSS in "w3schools", in the "link" chapter, they say:

"There are some order rules when setting a style for multiple link states:

a: hover MUST arrive after: link and a: visited a: active MUST come after: hover "

I want to know why the correct order is LVHA and not LHVA or the other.

+5
source share
2 answers

Pseudo-classes must be declared in a specific order.

The mnemonic L o V e HA te is always useful for remembering the correct order:

:link :visited :hover :active 

Each pseudo-class corresponds to an event that can occur only on the timeline than the previous one.

I.e:

  • The link is not displayed before visiting it.

  • The link is visited before it hangs.

  • The link will depend before it is actively used.

+6
source

The main reason is that the last rules are executed after the previous ones found in the document in CSS in order, which means that the behavior of the latter will be executed after all previous agreed rules are executed. Therefore, their order is important in order to avoid overlap, which will affect each other's behavior.

If, for example :link is placed after :visited , some behavior :visited will overlap, for example, its color is displayed, probably like a regular link, despite the visit.

+1
source

Source: https://habr.com/ru/post/1237977/


All Articles