Simple CSS: Change Text Selection/Highlight Color


When I visited some website today, I noticed that when I select or higlight the text, the appearing color is not the default blue #000FF as I usually do. Google a bit and found out the solution is just as plain as my near empty CSS knowledge. What you need to do is copy and paste the code below into your current blog CSS.

Here is your code (Place it anywhere in between <head> and </head>):
::selection { background: #336699; color: white; /* Safari */ }
::-moz-selection { background: #336699; color: white; /* Firefox */ }
You will need to use/paste both code. As you can see the above code is tailored for only Safary and Firefox, and other modern browser I think. Internet Explorer is an exception as usual. It may seem like nothing but simple change can sometimes make your page aesthetically pleasant. If you are now using Firefox/Safari, highlight any text on this blog as your live example.

The above #336699 is blue. Other normally used background color are:
#A8141B
#FF0000


No comments:

Post a Comment