css selection改变文字反选的背景颜色

最近在访问一个网站的时，我注意到，当其文字被选中时它有一个匹配他的网站的背景色，这个背景色不是是深蓝色。此刻，若是您的网站不利用任何蓝色为文字背景，看上去会不会有点不合适？

在计算机操作中经常会有反选出现，系统一般会根据选择区域的颜色，显示出补色。但windows默认的文字选择时，背景为蓝色，前景色为白色，如果背景是深色，则文字为蓝色，背景变成白色。如下图所示：

反选后默认的样式

能不能改变选择的默认颜色呢，也许很多人对这个问题不是很在意，也可能你早就见到过这个效果了，但是却忽略了。

给出了如下的CSS代码：

::-moz-selection{ /*针对Firefox*/ 
background:#cc0000; 
color:#fff; 
 } 
::selection { 
background:#cc0000; 
color:#fff; 
} 

code::-moz-selection { /*code是标签选择器，可以换成p或span等*/ 
background: #333333; 
} 
code::selection { 
background: #333333; 
}

通过以上代码可以看出，你完全可以给不同的容器定义不同的反选背景颜色

不过谷歌浏览器好像不支持这个 如果你发现谷歌浏览器实现类似效果的css代码 请留言跟进吧 哈哈

转载请注明：css selection改变文字反选的背景颜色 - 编程知识库