Skip to: content, navigation

:focus (CSS selector)

Spec
Version
CSS2
Browser support (more…)
IE7 FF1+ SA1.3+ OP9.2+
None Full Full Full

Syntax

:focus {
declaration block
}

Description

This pseudo-class matches any element that has keyboard input focus. Keyboard input focus describes any element that’s ready to receive user input. It can apply to a form control, for instance, or to a link if the user navigates using the keyboard.

Example

This rule applies a border around any text textarea element that has focus:

textarea:focus {
  border: 2px solid blue;
}

Compatibility

Internet Explorer Firefox Safari Opera
5.5 6.0 7.0 1.0 1.5 2.0 1.3 2.0 3.0 9.2 9.5
None None None Full Full Full Full Full Full Full Full

Internet Explorer 7 and earlier versions don’t support this pseudo-class; however, Internet Explorer 5.5 and 6 incorrectly apply the pseudo-class :active to links that have keyboard input focus—a state that should be matched by this pseudo-class.

User-contributed notes

There are no comments yet.

Add a note

To post a note on this topic, please log in with your SitePoint username and password. If you don't have an account yet, you can create a new account for free.

Related Products

Search