Tuesday September 15, 2009 
When you click and drag your mouse to select text on a website it highlights the text by giving it a default blue background colour. This blue text selection colour is set by your browser, but wouldn’t it be nice to be able to change it?
Perhaps you’d like to change it to a colour that matches your website colour scheme? Well, it’s pretty simple to change the background color of selected text by using CSS 3. It will work on modern browsers including Firefox and Safari and simply be ignored by other browsers.
In order to get this working you simply need to add the following styles to your Stylesheet. Let’s assume that you want your selected text to be white with a red background.
/* Change background color of selected text */
::selection {
background: #FF0000;
color: #FFFFFF;
}
::-moz-selection {
background: #FF0000;
color: #FFFFFF;
}
Now you have successfully overridden the default text selection colour with a few lines of CSS.
Adham Dannaway
Yep, that's me. I'm a Web Designer and Blogger from Sydney Australia with a passion for noodles, beer and design. Check out my other sites: Mac or PC, illumin8 Design
This is well bad man!