改变网页文本选中的默认背景颜色

改变网页文本选中的默认背景颜色，可以更好的突出你的主题色调，使你的网站更有个性与美观 。

效果图

---

默认

改变后

源码分析

---

文本选中是默认蓝色背景与白色字体，与主题色调不搭，所以我们可以设置自己想要的颜色。

代码：

<style type="text/css">
::selection {
    color:#fff;
    background-color: #5CB85C ;
}

::-moz-selection {
    color:#fff;
    background-color: #5CB85C ;
}

::-webkit-selection {
    color:#fff;
    background-color: #5CB85C ;
}
</style>

效果：

我们会发现颜色被改变了。

如果说，你不想定义全局，也可以用CSS 定义局部标签内容文字选中后的样式状态。
比如，定义只定义第一段是文字选中绿色背景。

代码：

<style type="text/css">
.first_p::selection {
    color:#fff;
    background-color: #5CB85C ;
}

.first_p::-moz-selection {
    color:#fff;
    background-color: #5CB85C ;
}

.first_p::-webkit-selection {
    color:#fff;
    background-color: #5CB85C ;
}

</style>

效果：

index.html

<div class="panel-body">
    <h2>Ghost 桌面版 APP 正式发布，能同时管理多个 Ghost 博客</h2>
    <p>作者：<font color="#5CB85C">wenteryan</font>  • 2016年5月12日</p>
    <br>
    <p class="first_p">虽然通过浏览器管理 Ghost 博客虽然很方便，但是在多个 tab 之间切换有时候也会很麻烦，嗯，如果能有一个独立的 app 应该使用起来会更爽一些！</p>
<p>今天的主角来了，Ghost 桌面版 APP -- Ghost Desktop！</p>
<p>目前，Ghost Desktop 还处于早期阶段，但是已经是一个全功能版本了，并且 Ghost Desktop 运行良好，支持自动更新，已经完全支持 Mac、Windows 和 Linux 平台了。补充一下，Ghost Desktop 是完全开源的（这还用说吗？）。</p>
<p>其实 Ghost Desktop 于数周前就已经开放给大家预览了。</p>
<p>众所周知，Ghost 是一个有非盈利组织支持的开源项目。Ghost Desktop 由志愿者 Felix Rieseberg 独立开发的，并且他还是一位微软的开源布道者。</p>
<p>官方下载地址（且慢点击，先看下面）：https://ghost.org/downloads/</p>
    </p>
    <br>
    <a href="zxingcoder" class="btn btn-success" type="submit">下一篇</a>
  </div>
</div>
</div>

总结

---

本文其实没有什么内容，小技巧展示而已。如果文中有什么表述不准确的地方欢迎指正，也欢迎通过评论进行交流。