CSS3 selector – ::selection{}

Found in categories: CSS, Design, Development, Web Development.

CSS3 selector – ::selection{}

There are some great new features in the up and coming CSS3 spec – which will be released as modules I believe instead of just a standard. Some are less commonly know than others. Whereas some are only partially supported features as this is but that’s ok we’ll take what we can. We’ll need a vendor prefix also in the style and hope later it gets more support from other vendors. We can do some great things with CSS, one feature is the ::selection, selector. This selector enables you to set the colour of the background of some text on your page when someone highlights it with their mouse, say in order to copy and then paste it somewhere (copyrighters beware)

Unfortunately for now it only works on the background property of the element and not the text itself but it’s a good feature nonetheless and you can change the background accordingly depending on your page style and fonts.
So for example, you could have a white page with black text you don’t want people to copy and paste. In this case you’d simply use the following code snippet.

::selection{
background:#ffffff;
}
::-moz-selection{
background:#ffffff;
}

NB: Currently, this selector is only supported in Safari and Firefox.

Leave a Reply

Your email address will not be published. Required fields are marked *