haizlin/fe-interview

[html] 第74天 在a标签上的四个伪类执行顺序是什么？

haizhilin2013 opened this issue · 8 comments

haizhilin2013 commented

第74天 在a标签上的四个伪类执行顺序是什么？

git710 commented

love hate

  • link
  • visited
  • hover
  • active
beijihan commented

简称 LV HAO -- lv 好

  • 👍3
Suntgr commented

我觉得你应该问的是四个伪类书写顺序吧

  • 👍2
xiangshuo1992 commented

执行顺序应该是：

  • link
  • hover
  • active
  • visited

因为存在样式层叠问题，所以书写顺序需要调整，把类似hover这种瞬时状态覆盖link这种常态

  • link
  • visited
  • hover
  • active
xxf1996 commented

有点没理解执行顺序是什么意思，只知道四个伪类的书写顺序应该是:link -> :visited -> :hover -> :active（LVHA）；

  • 👍1
chenshijin1 commented 
link > visited > hover > active

简称 lvha(love-ha)

伪类的优先级是一样的，所以后出现的伪类会覆盖先出现的伪类（同时激活）

在这里，比如把 hover 放在 active 后面，那么实际你在激活（active）链接的时候就触发了 hover 伪类，hover 在后面覆盖了 active 的颜色，所以始终无法看到 active 的颜色

MrZ2019 commented

love hate

  • link
  • visited
  • hover
  • active
  • 👎1
Cason35 commented

link=>visited=>hover=>active (lvha)