CSS3 Click Chart | CSS3 Browser Support and Information

Selection Pseudo-Element

Using a pseudo-element, allows you to change the text color or background color on selected text.

Specification

* Not in the spec

Example Code

::selection {
    background: #50bc6b; /* WebKit, Opera, & IE9 */
    color: white;
}

::-moz-selection {
    background: #50bc6b; /* Firefox */
    color: white;
}

Live Demonstration

Select the text in this paragraph. The background color and text color will change to purple and hotpink for the selected area.

Desktop Browser Support

Standard Syntax:
IE9+, Chrome 4+, Safari 4+, Opera 10.1+

Vendor Prefix:
Firefox 3+

Tools / Polyfills

Tutorials / Articles

::selection on MDN