IE8：分组标签颜色的定义与修改

bhpxorn

IE 8 浏览器新增的一个特色功能就是标签（选项卡）的颜色分组。在默认设置中，IE 8 的标签初始为淡蓝色（RGB = 227,238,251），第一次分组后变化为浅绿色（RGB = 140,227,190）、第二次变化为冰蓝色（RGB = 185,205,246）、第三次变化为淡黄色（RGB = 255,251,209）、第四次变化为浅紫色（RGB = 222,160,228）。假设继续出现第五次分组，将重新由浅绿色开始重复四色循环。直到相同颜色的同组标签被关闭到只剩一个，或者用户手动撤消颜色分组，标签才会恢复为默认的淡蓝色。假设希望自己修改 IE 8 标签在初始状态以及四种分组时使用的颜色以及颜色的轮换顺序，可以参考本文。 　　在默认的设置中，IE 8 定义的淡蓝－浅绿－冰蓝－淡黄－浅紫的颜色顺序是固定不变的，用户无法自行修改这些颜色或调整其出现的先后顺序。对于有些用户而言可能觉得无所谓、能用就行；而对于一些用户来说，可能很希望自行设置 IE 8 的分组标签颜色。主要原因有：
　　1.默认的五种颜色都有些偏冷，需要红色、橙色、紫色等暖色调加以调和；
　　2.默认的五种颜色轮换顺序缺乏规律可循、不容易记忆，假设能够按照红－黄－绿－蓝－紫的大致的彩虹顺序轮换则比较醒目，同时也方便用户想起这是第几次分组；
　　3.众所周知在同一 IE 窗口中每次只能有一个标签处于前台、其余标签处于后台，在 IE 8 默认设置中只有那一个处于前台的标签拥有颜色渐变、处于后台的其它标签都是单调的纯色，应该加以修改，使后台标签也具有颜色渐变；
　　4.当鼠标悬停在处于后台的标签时，这个标签的颜色改变很不明显，用户不太容易根据颜色变化判断鼠标是否已悬停在后台标签上。
　　综合以上原因，决定对 IE 8 的分组标签颜色进行一次彻底的修改。
　　IE 8 的分组标签颜色由 IE 8 程序文件 Windowssystem32IEFrame.DLL 中的 UIFILE 定义，使用 Resource Hacker 打开此文件（推荐用 Resource Hacker，eXeScope 修改 UIFILE 不如 Resource Hacker 方便），展开 UIFILE 分支，Windows XP 用户修改 UIFILE 中的 20481、Windows Vista 用户修改 UIFILE 中的 20737。
　　1.后台标签的单色修改：
　　按照由简至难的顺序，我们首先修改单色的后台标签。在 UIFILE 中搜索字符串 rgb(227,238,251)，找到下列语句：
　　<IETabOverlay background = "themeable(rgb(227,238,251),buttonface)" />
　　这段语句定义了后台标签初始的淡蓝色（RGB = 227,238,251），我们可以根据自己的喜好将其修改为自定义颜色的 RGB 值。
　　接下来紧随着这段语句，我们可以看到：
　　<if class="group1"><IETabOverlay background = "rgb(140,227,190)" /></if>
　　这段语句即定义了当 IE 8 进行第一次分组时，将标签变化为浅绿色（RGB = 140,227,190）。
　　依此类推，我们可以继续找到 <if class="group2">、<if class="group3">、<if class="group4">，分别代表第二次、第三次、第四次的颜色变化，根据自己的喜好修改相应的 RGB 值即可。
　　附注：IE 8 后台标签默认颜色设置对照：
初始值：（RGB = 227,238,251）
第一组：（RGB = 140,227,190）
第二组：（RGB = 185,205,246）
第三组：（RGB = 255,251,209）
第四组：（RGB = 222,160,228）
　　2.后台标签由单色到渐变色的修改：
　　下面介绍一下如何将后台标签由单色升级为渐变色，假设希望保持后台标签为单色，可以跳过这部分内容。
　　以后台标签初始的淡蓝色语句为例：
<IETabOverlay background = "themeable(rgb(227,238,251),buttonface)" />
　　这段语句中的 rgb(227,238,251) 定义了这是一个淡蓝的单色（RGB = 227,238,251），如需将其修改为渐变色，需要将 rgb(XXX,XXX,XXX) 替换为 gradient(rgb(XXX,XXX,XXX),rgb(XXX,XXX,XXX),1)。比如：
　　假如将
<IETabOverlay background = "themeable(rgb(227,238,251),buttonface)" />
　　替换为
<IETabOverlay background = "themeable(gradient(rgb(195,221,251),rgb(242,246,251),1),buttonface)" />
　　那么后台标签就可以由默认的淡蓝色（RGB = 227,238,251）升级为从（RGB = 195,221,251）到（RGB = 242,246,251）的淡蓝色渐变了。
　　依此类推，<if class="groupX"> 后面的语句也可以按此修改，从而将所有分组的后台标签全部由单色升级为渐变色。
　
　　3.鼠标悬停在后台标签时的颜色修改：
　　在 IE 8 的默认设置中，当鼠标悬停在后台标签时，后台标签会从单色变化为一个不明显的渐变色。比如初始的淡蓝色（RGB = 227,238,251），悬停时会变为从（RGB = 163,201,248）到（RGB = 242,246,251）的淡蓝色渐变。虽然悬停后换成了渐变色，但却与默认的单色实在太接近了。
　   当鼠标悬停在后台标签上时，还是按照 IE 7 的方案将其改变颜色比较醒目。在 IE 7 的默认设置中，后台标签原本为银色渐变、鼠标悬停后显示为淡蓝色渐变，比 IE 8 醒目多了。
　　如需修改鼠标悬停在后台标签时的颜色，在 UIFILE 中搜索字符串 (rgb(163,201,248),rgb(242,246,251)，找到下列语句：
<IETabOverlay background = "themeable(gradient(rgb(163,201,248),rgb(242,246,251),1), buttonface)" />
　　这段语句定义了当鼠标悬停在后台标签时初始的淡蓝色渐变，我们可以根据自己的喜好将其修改为自定义颜色的 RGB 值。
　　依此类推，接下来紧随着这段语句可以依次找到 <if class="groupX">，不过这些语句的格式略微有所改变，需要在最后重复一下此种渐变色在鼠标悬停之前的单色。比如 <if class="group1"> 语句为：
<if class="group1"><IETabOverlay background = "themeable(gradient(rgb(21, 227,140),rgb(242,246,251),1), rgb(140,227,190))" /></if>
　　可以看到它重复了一下在鼠标悬停之前的浅绿单色（RGB = 140,227,190）。我们按照它的格式修改相关的 RGB 值就可以了。
　　需要注意的是，假设之前已经按照方法 2 将后台标签由单色升级为了渐变色，在这里重复时也必须替换为相应的渐变色。
　　附注：IE 8 鼠标悬停在后台标签时默认颜色设置对照：
初始值：从（RGB = 163,201,248） 到 （RGB = 242,246,251）
第一组：从（RGB = 21,  227,140） 到 （RGB = 242,246,251）
第二组：从（RGB = 122,163,245） 到 （RGB = 242,246,251）
第三组：从（RGB = 255,240,  45） 到 （RGB = 242,246,251）
第四组：从（RGB = 204,108,214） 到 （RGB = 242,246,251）
　　4.前台标签的渐变色修改：
　　现在还剩下最后一个修改的元素，就是 IE 8 窗口中唯一的一个处于前台的标签。前台标签在默认的设置中也采用了渐变色，但是也与后台标签相差不大。好在这个唯一的前台标签比其它后台标签要高一些，所以颜色接近的问题可以忽略。
　　如需修改前台标签的颜色，在 UIFILE 中搜索字符串 (rgb(195,221,251),rgb(242,246,251)，找到下列语句：
<IETabOverlay background = "themeable(gradient(rgb(195,221,251),rgb(242,246,251),1), gradient(buttonhighlight,buttonface,1))" />
　　这段语句定义了前台标签的渐变，我们可以根据自己的喜好将其修改为自定义颜色的 RGB 值。
　　依此类推，接下来紧随着这段语句可以依次找到 <if class="groupX">，不过这些语句的格式略微有所改变，需要在最后重复一下此种渐变色的第一种颜色。比如 <if class="group1"> 语句为：
<if class="group1"><IETabOverlay background = "themeable(gradient(rgb(104,218,169),rgb(242,246,251),1),gradient(rgb(104,218,169),buttonface,1))"  /></if>
　　可以看到它重复了一下渐变色的第一种颜色（RGB = 104,218,169）。我们按照它的格式修改相关的 RGB 值就可以了。
　　附注：IE 8 前台标签默认颜色设置对照：
初始值：从（RGB = 195,221,251） 到 （RGB = 242,246,251）
第一组：从（RGB = 104,218,169） 到 （RGB = 242,246,251）
第二组：从（RGB = 159,187,243） 到 （RGB = 242,246,251）
第三组：从（RGB = 255,244,139） 到 （RGB = 242,246,251）
第四组：从（RGB = 215,141,223） 到 （RGB = 242,246,251）
　　至此，我们便完成了后台标签、有鼠标悬停的后台标签、前台标签在初始值以及四种分组时的全部颜色修改。根据上述方法，我们完全可以按照自己的喜好，设计一套属于自己的 IE 8 分组标签颜色方案。可以将默认顺序“淡蓝－浅绿－冰蓝－淡黄－浅紫”按照彩虹的大致顺序修改为“淡紫－淡红－淡黄－淡绿－淡蓝”。