Skip to content

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

Open
@haizhilin2013

Description

@haizhilin2013
Collaborator

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

Activity

git710

git710 commented on Jun 29, 2019

@git710

love hate

  • link
  • visited
  • hover
  • active
beijihan

beijihan commented on Jun 29, 2019

@beijihan

简称 LV HAO -- lv 好

Suntgr

Suntgr commented on Jun 29, 2019

@Suntgr

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

xiangshuo1992

xiangshuo1992 commented on Jul 1, 2019

@xiangshuo1992
Contributor

执行顺序应该是:

  • link
  • hover
  • active
  • visited

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

  • link
  • visited
  • hover
  • active
xxf1996

xxf1996 commented on Jul 2, 2019

@xxf1996

有点没理解执行顺序是什么意思,只知道四个伪类的书写顺序应该是:link -> :visited -> :hover -> :activeLVHA);

chenshijin1

chenshijin1 commented on Dec 7, 2020

@chenshijin1
link > visited > hover > active

简称 lvha(love-ha)

伪类的优先级是一样的,所以后出现的伪类会覆盖先出现的伪类(同时激活)

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

smile-2008

smile-2008 commented on Jan 22, 2021

@smile-2008

love hate

  • link
  • visited
  • hover
  • active
Cason35

Cason35 commented on Oct 22, 2021

@Cason35

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @smile-2008@haizhilin2013@Suntgr@xxf1996@xiangshuo1992

        Issue actions

          [html] 第74天 在a标签上的四个伪类执行顺序是什么? · Issue #517 · haizlin/fe-interview