Wikidot Design & Development

26 Apr 2011 05:32

26 Apr 2011 05:32

read more

Changing text selection colour

How to change the colour of text selections with CSS

This one's pretty simple - changing the colour of text selections to suit your theme.

/* Webkit */
::selection {
    background-color: rgba(255,111,111,0.9);
    color: #000;
}
 
/* Mozilla */
::-moz-selection {
    background-color: rgba(255,111,111,0.9);
    color: #000;
}

As above, it will change the text selection all across your site. For a more specific use, you can remove the selection background from images when they are dragged (which seems to occur by default in Firefox).

img::selection {background-color: transparent;}
img::-moz-selection {background-color: transparent;}

Try dragging the two images below (Safari/Chrome only; Firefox has this behaviour automatically):

read more — 4 comments

tags — image selection