Want to share your CSS expertise with others? Apply to the MDN Fellowship by April 1! http://mzl.la/MDNFellowship

mozilla

Revision 9047 of ::selection

  • Revision slug: CSS/::selection
  • Revision title: ::selection
  • Revision id: 9047
  • Created:
  • Creator: Jürgen Jeka
  • Is current revision? No
  • Comment 31 words added

Revision Content

{{ CSSRef() }}

Summary

The ::-moz-selection (::selection) pseudo-element applies to the portion of a document that has been highlighted by the user.

Examples

/* draw any selected text yellow on red background */
::-moz-selection, ::selection { color:gold; background:red; }
/* draw selected text in a paragraph white on black */
p::-moz-selection, p::selection { color:white; background:black; }

Notes

::selection was drafted for CSS3 Selectors but is expected to be removed from the final standard. Anyhow, it's implemented in Firefox and other browsers.

The CSS properties that apply to ::selection pseudo-elements are limited: color, background, cursor, outline. 'background-image' may be ignored.

Specifications

Browser compatibility

Browser Lowest Version  
Internet Explorer n/a  
Firefox 1.0 ::-moz-selection
Opera 9.5 ::selection
Safari 2.0 ::selection

 

Revision Source

<p>{{ CSSRef() }}</p>
<h3 name="Summary">Summary</h3>
<p>The <code>::-moz-selection</code> (<code>::selection</code>) pseudo-element applies to the portion of a document that has been highlighted by the user.</p>
<h3 class="editable"><span> Examples </span></h3>
<pre class="brush: css">/* draw any selected text yellow on red background */
::-moz-selection, ::selection { color:gold; background:red; }
/* draw selected text in a paragraph white on black */
p::-moz-selection, p::selection { color:white; background:black; }</pre>
<h3 name="Notes">Notes</h3>
<p><code>::selection</code> was drafted for CSS3 Selectors but is expected to be removed from the final standard. Anyhow, it's implemented in Firefox and other browsers.</p>
<p>The CSS properties that apply to <code>::selection</code> pseudo-elements are limited: color, background, cursor, outline. 'background-image' may be ignored.</p><h3 name="Specifications">Specifications</h3>
<ul> <li><a class="external" href="http://www.w3.org/TR/2005/WD-css3-selectors-20051215//#UIfragments" rel="external nofollow" target="_blank" title="http://www.w3.org/TR/2005/WD-css3-selectors-20051215//#UIfragments">CSS3 Selectors (Draft 2005-12-15)</a></li>
</ul>
<h3 name="Browser_compatibility">Browser compatibility</h3>
<table class="standard-table"> <tbody> <tr> <th>Browser</th> <th>Lowest Version</th> <th> </th> </tr> <tr> <td>Internet Explorer</td> <td>n/a</td> <td> </td> </tr> <tr> <td>Firefox</td> <td>1.0</td> <td><code>::-moz-selection</code></td> </tr> <tr> <td>Opera</td> <td>9.5</td> <td><code>::selection</code></td> </tr> <tr> <td>Safari</td> <td>2.0</td> <td><code>::selection</code></td> </tr> </tbody>
</table>
<p> </p>
Revert to this revision