百分百

博客系统已经提供了一些可供直接选用的共享主题，如果博主希望自己的博客站点能有更独特的外观（文本颜色、背景图片、页面布局等等），还可以使用自定义主题来定制页面显示效果。本文将介绍改变各类文本颜色的基本技巧。

用户登录后，在某一博客的操作菜单中点击“设置”>“外观设计”>“自定义主题”，选择一个现成的主题模板复制一份，就可以在此基础上任意设计博客的外观了，这里我们选择的主题是“Fauxcoly”：

这是共享主题默认的外观：

点击“设置”>“外观设计”>“模板”，将会列出博客使用的所有模板文件，其中有一个样式表文件“style.css”，页面元素的外观风格主要是在这里面定义的。

点击style.css文件打开编辑窗口，可以看到这一段代码：

#header_content,
#header_content a:hover,
#header_content a:link,
#header_content a:active,
#header_content a:visited {
    color: white;
    text-decoration: none;
} 

这是页顶横幅（包括博客标题、宣传语和导航菜单）中文本和链接的样式定义（白色，无下划线），将其中的“color: white”改为“color: yellow”，点击保存按钮，即可将这部分文本改为黄色。

再找到这一段代码：

li.rNavItem {
    list-style-type: none;
    display: inline;
    padding: 0.3em;
    margin: 0 0.5em 0 0.5em;
} 

这是导航菜单项的样式定义，在其中加上一行“background: rgb(0,0,255);”（这里是用红绿蓝三原色来定义颜色，每种颜色的取值是0~255），即可将导航菜单项加上蓝色背景。

再找到这一段代码： 

h2,
#main_content h2.entryTitle a:hover,
#main_content h2.entryTitle a:link,
#main_content h2.entryTitle a:active,
#main_content h2.entryTitle a:visited {
    color:#CC0000;
    font-size:130%;
    text-decoration: none;
    margin: 1em 0 0 0;
} 

这是文章标题的样式定义，将其中的“color: #CC0000;”改为“color: #106D0C;”（这是三原色的十六进制表示法，每种颜色的取值是00~FF），即可将文章标题改为深绿色。

这是修改后的页面外观：

用户可以使用浏览器的审查元素功能（在页面元素上右击即可选择此功能）查看任何页面元素的名称和样式定义，还可以实时修改并预览效果（推荐使用谷歌的Chrome浏览器）。用户还可以找一些现成的工具来为页面元素挑选适宜的颜色，例如在线网页拾色器。