CSS 變更選取文字的背景色

在 CSS3 的規範中，多了一些選擇器 ( selector ) 的定義，提供設計師更多元的元素操作方法。其中一項新增的選擇器是 ::selection，表示被選取的文字。

透過這項選擇器便能做出不同的選取區背景色。簡單的範例如下

<style>
p.yellow::selection {
	background: #fff2a8;
}
p.yellow::-moz-selection {
	background: #fff2a8;
}
</style>

選取以下的文字試試

If you want a reason as to why this decision has been made, Blizzard is happy to provide you with two. The first is of course piracy, which they believe an always-connected game will limit. The second is down to providing a fair game on Battle.net.

Blizzard is not allowing any mods in Diablo III and doesn’t want any cheats being used either. The developer states the only way to control this is with a game they can guarantee isn’t running any such additional software. Keeping you online during play apparently solves that problem and means whatever level your character is, is a true representation of the time you have spent in the game, not some mod or cheat working overtime in the background.

至本文完成時，Chrome 12、Opera 11 都能直接看到效果，Firefox 5 則需要用 ::-moz-selection 語法才行。IE9 不支援此效果。