离线维基百科wikisrvd修改各处字体外观的方法

先打个广告：欢迎关注我的公众号，参与 文史大挑战 趣味题目。使用方法见 这篇文章 。

正文开始：

iPhone、iPad上可以用wikisrvd浏览离线维基百科，可谓一款杀手级应用，可是wikisrvd默认的字体非常小，读起来很吃力。其实只要修改内部的配置文件或者源文件就可以调整字体的各种外观。本文介绍修改的方法。

离线维基百科让我们随时随地可以浏览强大的维基百科。只要我们定时上网手动更新数据库，就可以看到最新的内容。

可是wikisrvd默认的字体非常小，读起来很吃力。其实只要修改内部的配置文件或者源文件就可以调整字体的各种外观。下面讲讲修改各处字体外观的方法。

怎么找到wikisrvd的配置文件

使用 ifunbox 或者 iTools 打开iPhone或者iPad的文件系统。寻找如下路径：

/var/mobile/wikisrvd/daemon/webcontent

这就是 wikisrvd 的工作目录，下面的操作都是以工作目录为起点，所指代的文件都是位于工作目录下。修改每一个值后都可以刷新 Safari 浏览器查看效果。

修改首页的名称

打开index.html，在末尾部分寻找如下的样式片段

<span style="font-family:Arial; font-size:18px">

把后面的文字修改为你想要改的文字，字体大小可以修改属性内font-size的值.

例如，为达到上图的效果，我修改为

<span style="font-family:Arial; font-size:36px">维基百科的目标是完整、准确且中立的百科全书！</span>

修改搜索栏字体大小

首先要修改文本框的外围容器大小，就是上下的灰色边框。在 index.html 的第28行左右，寻找如下的样式片段

.tableRowSearchBox {
    background-color:#a0a0a0;
    height: 35px;
    font-size:14px;
}

修改其中的 height: 35px; 改为需要的大小，比如: 42px 然后，稍往下，在第43行左右寻找如下的样式片段

.textBoxSearch{
    font-size:16px;
    height:29px;
    width: 100%;
}

修改其中的 height: 29px; 改为需要的大小，注意请不要超过前面 .tableRowSearchBox 中的 Height 值，并且最好相差是偶数，比如10。再修改 font-size:16px; 这是设定搜索文本框内字体的大小。

搜索建议结果字体大小

当在搜索文本框内输入文字后，框下面会出现推荐的建议结果，为了修改这些字体，在 indexl.html 内第85行左右寻找如下的样式片段

.suggestionListEntry {
    min-height: 22px;
    text-decoration: none;
    color: #000000;
    font-family: Arial;
    font-Size: 16px;
    font-weight: bold;
    padding-left: 4px;
    padding-right: 4px;
    padding-top: 4px;
    padding-bottom: 0px;
    border-bottom: solid 1px #e0e0e0;
    background-color: #ffffff;
    vertical-align: bottom;
}

把其中的 font-size:16px; 修改为你需要的大小。建议和上面的 .textBoxSearch 内设置成相同的大小。 然后按照相同的办法修改到下面一个样式里：

.suggestionListEntryMouseDown{
    min-height: 22px;
    text-decoration: none;
    color: #ffffff;
    font-family: Arial;
    font-Size: 16px;
    font-weight: bold;
    padding-left: 4px;
    padding-right: 4px;
    padding-top: 4px;
    padding-bottom: 0px;
    border-bottom: solid 1px #e0e0e0;
    background-color: #6060ff;
    vertical-align: bottom;
}

修改选择语言下拉菜单大小

到 index.html 第56行左右，找到

.selectLanguageCode{
    width: 100%;
    height: 29px;
    font-size: 16px;
}

修改 height: 29px; 的值。注意，这个值要和上面 .textBoxSearch 文本框的高度一致。

修改清除按钮的大小

就是下图中红框中的叉号：

这个按钮是纯图片，没有css样式表限制它的大小，只要用修改图片的尺寸，重新覆盖就可以。图片的路径是

images/clearButton.png

注意将图片的高度修改为和上面 .textBoxSearch 文本框的高度一致。

修改内容页面字体大小

打开样式表文件

stylesheets/wikisrv.css

修改条目字号

寻找如下的样式片段

.wkTitle{
    font-weight: bold;
    font-size: 18px;
    border-bottom: groove 2px #e0e0e0;
}

修改 font-size: 18px;

修改正文字号

寻找如下的样式片段

.wkBody{
    /* background-color: #ffffff; */
    font-size: 10pt;
    line-height: 14pt;
    margin: 8;
}

修改 font-size: 10px; 为你想要的字号。

修改1号标题字号

寻找如下的样式片段

.wkHeadline1
{
    font-size: 14pt;
}

修改 font-size: 14pt; 为你想要的字号。其余级别的标题方法类似。

修改链接字体颜色

寻找如下的样式片段

a.wkInternalLink
{
    color: #0000a0;
    text-decoration: none;
}

修改 color: #0000a0; 比如，改为 #0066CC ，或者 #FF0033

其他样式都在该文件内，可以自己尝试摸索修改。但是最主要的几个在上面都已经提到。

如果您对本文有疑问或者寻求合作，欢迎 联系邮箱 。邮箱已到剪贴板

精彩评论