[CSS3]Change text selection color

This is fantastic CSS3 effect, you can customize your selection color.
You can try select a text on this blog to see it in action.


Default Setting(for all text element):

::selection {
background:#f094b7;
color:#555;
}

::-moz-selection {
background:#f094b7;
color:#555;
}

::-webkit-selection {
background:#f094b7;
color:#555;
}



Selective Setting(for selective text element):

p.orange::selection {
background:#c2660d;
color:#fff;
}

p.orange::-moz-selection {
background:#c2660d;
color:#fff;
}

p.orange::-webkit-selection {
background:#c2660d;
color:#fff;
}


Currently FireFox, Safari, Chrome and Opera support the text section attribute, and the browsers that don’t support it simply ignore the code so nothing will break, so it doesn’t really matter.

Write by Arafa Daming
Labels: ,