CSS :focus Selector

Complete CSS Reference Complete CSS Reference

Example

How to style a text field when it gets focus:

input:focus
{
background-color:yellow;
}

Try it yourself »

Definition and Usage

The :focus selector styles the element that has focus.

Tip: The :focus selector is allowed on elements that accept keyboard events or other user inputs.

Browser Support

Internet Explorer Firefox Opera Google Chrome Safari

The :focus selector is supported in all major browsers.

Note: For :focus to work in IE, a <!DOCTYPE> must be declared.

CSS Version

The :hover selector was first introduced in:

CSS 1

Related Pages

CSS tutorial: CSS Pseudo classes

Complete CSS Reference Complete CSS Reference