73

Is it possible to match all links without href specified via CSS?

Example:

<a>Invalid link</a>

I know its possible to match all links with href but I'm just looking for the opposite.

BoltClock
  • 700,868
  • 160
  • 1,392
  • 1,356
knoopx
  • 17,089
  • 7
  • 36
  • 41
  • 1
    Note that "invalid" here doesn't mean "invalid HTML", but "invalid hyperlink", meaning it doesn't actually point anywhere. – BoltClock May 14 '12 at 18:35

1 Answers1

141

Either use CSS3's :not():

a:not([href]) {
    /* Styles for anchors without href */
}

Or specify a general style for all a, and one for a[href] to override it for those with the attribute.

a {
    /* Styles for anchors with and without href */
}

a[href] {
    /* Styles for anchors with href, will override the above */
}

For the best browser support (includes ancient but not quite forgotten browsers), use the :link and :visited pseudo-classes instead of the attribute selector (combining both will match the same as a[href]):

a {} /* All anchors */
a:link, a:visited {} /* Override */

Also see this answer for an in-depth explanation of a[href] versus a:link, a:visited.

Community
  • 1
  • 1
BoltClock
  • 700,868
  • 160
  • 1,392
  • 1,356