Grow your CSS skills. Land your dream job.

How To Remember The Order of Selectors: LOVE and HATE

Published by Chris Coyier

I read a comment the other day over on CSS Drive from someone named Slackerbabe that I thought was worth repeating.

Heres a cool way to remember the order of the four selectors, "LVHA (link visited hover active)",....

Just think 'LOVE' (LV) and 'HATE' (HA)....

The selectors she is referencing is for anchor elements:

  • a:link
  • a:visited
  • a:hover
  • a:active


  1. Permalink to comment#

    Thank you so much. Now I get it right. I always forget the ACTIVE selector. :)
    Nice blog, by the way!

  2. Oh! Very good! I remenber this!

  3. And if you want to add a a:focus to this (which is the same as “a:hover” except it targets non-pointer-tool devices like TABs, assistive technologies for the handicapped that cannot use a “mouse”, etc),

    a:link {….}
    a:visited {….}
    a:focus, a:hover {…}
    a:active {….}

    if you are a STAR WARS fan, just think:
    “lord vader’s former handle anakin”
    and you have just added some Accessibility s. 508 to your pages.

    I was not the one to think this up, -btw. I merely repeat it here to share.


  4. Or, use “LoVe For HAte”

  5. Hoodie
    Permalink to comment#

    aka pseudo-classes.

This comment thread is closed. If you have important information to share, you can always contact me.

*May or may not contain any actual "CSS" or "Tricks".