掌上百科 - PDAWIKI

 找回密码
 免费注册

QQ登录

只需一步,快速开始

查看: 5056|回复: 9

[经验交流] GoldenDict如何建立article-style.css并设置字体?[动图示例]

[复制链接]

该用户从未签到

发表于 2018-2-5 18:01:44 | 显示全部楼层 |阅读模式
本帖最后由 Oeasy 于 2018-2-12 19:51 编辑 $ ]% v/ L6 l3 _$ q2 A, H
  E0 F( Z1 q3 z6 Q  ~7 W
# GoldenDict 如何建立 article-style.css 并设置字体?[动图示例]& t8 Y$ {, c; p# X* f( z7 n( F5 j

( U1 r: F  ~9 z! @: L; {$ R刚使用 GoldenDict 的朋友会问一些很基础的问题,今天有朋友问“GoldenDict 如何设置字体”。
  n5 n9 K: U7 q# w8 {) A' p其实已经有一些帖子了,我这里再发一个,“精心”录制了 gif ,希望能对新人有所帮助。这些简单的问题,真·大神从不讲,我也是一步一步知晓这些细节的。知道新人的苦,新手的泪,所以也不厌其烦,写了些看上去很“弱”的入门贴,希望对大家有所帮助。! o$ G  w% F7 }

: Z* q0 X* ?$ v# S$ F-  GoldenDict 界面显示风格、字体、背景等等的修改 https://pdawiki.com/forum/thread-14082-1-1.html& z0 J" c4 v2 K, {! l+ ?
- [GoldenDict] 如何为某部词典指定字体? https://pdawiki.com/forum/thread-15900-1-1.html: M9 E/ O' j6 q3 g- E3 I
. G. c* ~/ h1 u$ K0 v
看不到 gif  ,点不开大图 https://s1.ax1x.com/2018/02/05/9KWRqx.gif
7 G* {4 f5 q% s9 K% |1 d1 p* d/ M注:点击图片可查看大图,更清晰。
* k  O; m  r! P* f( i6 I               
" `7 o9 K1 l4 k  b. ]: \5 b
% p+ X: n6 k' E; a2 `& e6 b0 p
# m3 R9 n9 s2 I/ q( ?4 J0 b. Z3 g
, p! r6 P* }9 C2 b7 B2 t6 a3 M## 文字版步骤:# K8 J7 Y: N" s/ E  [9 g
步骤看上去很多(6 步),其实很简单,我只是写得尽量详(luo)细(suo)而已。你会打字,会上网,会吃饭,那下面的步骤,3 分钟搞定。$ k0 n& S7 v) p% X

% t( a2 X0 U; b* R+ m" ~1.  GoldenDict 菜单栏,依次点击【帮助】->【配置文件夹】,自动就蹦出文件资源管理器窗口(macOS 蹦出 Finder 窗口),定位到了配置文件夹。如果你按照这里的步骤第 3 步做了的话:" `0 i" d  C% E6 y0 ]6 p
        -  “GoldenDict 下载、安装、使用入门教程[Windows 版]” https://pdawiki.com/forum/thread-14072-1-1.html ,第 3 步 “新建 portable 文件夹”& Q+ N4 j4 g0 c* E
“配置文件夹”就是 portable 文件夹。, O5 t* }" p" M# k& `! d( L
' ]+ ]3 B9 A% D" n5 H$ p
2. 在“配置文件夹”下,新建两个 txt 文本文档:
7 _! w+ ~. E, O' f1 o, L& P- 新建文本文档.txt- z  `% `; \5 a( @% R! H9 K! m- |
- 新建文本文档 - 副本.txt
) f, a7 @# N; U/ X; k7 `
# X- G1 D- B4 w9 X7 p8 VWindows 10 下,文件资源管理器注意勾选“查看”->“文件扩展名”,否则看不到文件扩展名(.txt)。
: s( O( u4 s/ B: e/ s' K: [. N8 z. M7 |( o9 C
3. 将那两个 txt 分别更名为 article-style.css 和 qt-style.css
5 _- Y5 o8 f8 D5 x' Q一定注意,文件扩展名 .txt 也要删除并修改为 .css。重命名的时候,会提示“如果改变文件扩展名,可能会导致文件不可用。确实要更改吗??”,当然选择“是(Y)”。就改一个空的文本文档的名字而已,天塌不下来,电脑坏不了。: l, k4 {7 |) C$ c6 t  D+ R+ I  n
9 t$ G  g# P, V2 D
4. 打开 article-style.css 文件(默认是记事本打开,也可以用其他文本编辑器),把下面的内容复制、粘贴进去,保存!一定要保存!; x) ^9 x4 F  z, U' y: }# Y" i
) v# k- m9 B7 _" W7 O, K" J
  1. * {
    & V7 d* E) w  ?- t8 B& b
  2. font-family: Arial, "Microsoft Yahei"!important;, f1 {8 Q/ k; Q3 A& W% D* s
  3. }
复制代码
5 B2 r0 [& c8 k
5 Q7 X; L( o4 n
简单解释一下上面的 css 代码:3 w1 W5 B! M  U& O2 v9 c& e
我的目的是让 GoldenDict 软件里里外外,所有文字,能是 Arial 的就是 Arial ,汉字都是“微软雅黑”("Microsoft Yahei")。5 \# p/ F& s. ~/ M4 y* p! {# R
:: 通配选择器(universal selector),显示为一个星号(*)。该选择器可以与任何元素匹配,就像是一个通配符。5 K. W' ]8 G( U* q
:: 注意 css 里直接写字体的汉字名称“微软雅黑”可能没用,要用 "Microsoft YaHei" 且用英文引号括起来。
: P8 j0 M( t7 ^1 m/ q:: https://baike.baidu.com/item/css%20important/5283065+ h2 l6 @+ M) Y* j9 F
:: css !important 作用是提高指定 CSS 样式规则的应用优先权。
" u% c5 H1 [: U+ }8 H. I+ P) N8 w0 W  ~- o1 X/ U) ]
5. 打开 qt-style.css  文件,把上面的内容复制、粘贴进去,保存!一定要保存!
: Y' @; h. l. F- c/ o2 B1 Q6 E( n9 K
我这里只是简单示例, article-style.css 和 qt-style.css 可以设置很多东西,GoldenDict 的界面定制,魔法几乎全在这两个 css 里。
8 w  T3 b/ G! p不妨看看默认的“不到” 3000 行的 article-style.css  https://github.com/goldendict/go ... 6/article-style.css ,这里面的内容,都是可以定制的。6 K9 O1 Z! h/ Y" n7 x" _  _, O
不过,我是折腾来折腾去,觉得上面的 article-style.css 和 qt-style.css 已经够用了,其他的设置都是 GoldenDict 默认。
% n- N/ N$ O- V6 a1 I5 j4 @' ]8 O6 z3 z0 p/ J+ b
6. 依次点击 GoldenDict 菜单栏,【文件】->【重新扫描文件】,或者直接快捷键 Ctrl + F5 , article-style.css 和 qt-style.css  这两个 css 就生效了,仔细看看,是不是字体变了?% m  ]7 f) x5 M# }3 N
- 左侧默认的英文字体是 Tahoma ,中文字体是宋体(SimSun);
- M9 \( z) f4 y- }: m- 右侧的英文字体设置的 Arial,中文字体是微软雅黑(Microsoft YaHei)# f+ w$ M: C# v! m) Y( k
  ?' e( \/ ]% l# z8 E
大图点击:https://s1.ax1x.com/2018/02/05/9Kf0OI.png ,明显右边的显得更加平滑。0 Q' ~  G1 A. D6 o; {# t% ]8 ~0 `
注:点击图片可查看大图,更清晰。, T" h9 ^5 d; X" \5 A2 c
               
4 A1 n* l/ w- t$ `. b& W# J. ?: G7 ]' _5 g5 n( k
字体尤其是汉字字体如果没变,可能您选用的是 qt4 版本的 GoldenDict ,建议用 qt5 版本的。+ L4 ^, |! @- s# g  h

0 ]; T2 K7 j  U/ Z. [CSS 入门简单,但是又可以很复杂,有很多坑,我也只会很简单的。更多的个性定制方案,还需要大家自行摸索。
6 z' }3 N% x# l4 E' g4 k5 ?
( L! G. C8 L$ {& g# A; |8 q参考:
0 _) o3 b5 {. `  k( C. l" j1 v- GoldenDict 专贴!https://pdawiki.com/forum/thread-11705-1-1.html: K; _& k* l  z, X% ^' d/ C1 F" H

# j3 k  K: M- o0 b& t' X4 |# s6 h$ ^9 O% F

- o" _0 F5 \- Q' n6 h( I. q- E& R+ |7 u" Z3 f$ D

评分

6

查看全部评分

本帖被以下淘专辑推荐:

  • TA的每日心情
    慵懒
    2021-1-9 16:36
  • 签到天数: 26 天

    [LV.4]偶尔看看III

    发表于 2018-3-20 20:17:48 | 显示全部楼层
    谢谢O大,总算解决了goldendict看着字体巨细辣眼睛的问题,但是好像依旧没有mdict里面的字体美观也不知道是我电脑原因不是。没有学过css,我看着另外一个教程的css文件,试探性的在上面两个文件里加了一句【 font-size: 16px;】使得词典大小统一了,不会再次因为缩放使得某些词典字体太大。

    评分

    1

    查看全部评分

  • TA的每日心情
    开心
    2019-12-28 16:46
  • 签到天数: 144 天

    [LV.7]常住居民III

    发表于 2018-3-13 15:08:23 | 显示全部楼层
    学习了,谢谢楼主
  • TA的每日心情

    2021-1-8 14:40
  • 签到天数: 32 天

    [LV.5]常住居民I

    发表于 2019-11-16 19:04:12 | 显示全部楼层
    谢谢,正在学习css,一步一步学习。
  • TA的每日心情
    擦汗
    2020-12-6 11:47
  • 签到天数: 159 天

    [LV.7]常住居民III

    发表于 2020-2-3 22:45:00 | 显示全部楼层
    谢谢O大的入门贴,学到了
  • TA的每日心情
    擦汗
    2021-1-9 08:04
  • 签到天数: 76 天

    [LV.6]常住居民II

    发表于 2020-3-2 10:38:47 | 显示全部楼层
    感谢指导,很有用
  • TA的每日心情
    慵懒
    2020-11-21 04:14
  • 签到天数: 78 天

    [LV.6]常住居民II

    发表于 2020-3-3 21:58:22 | 显示全部楼层
    谢谢楼主分享
  • TA的每日心情
    奋斗
    2020-7-5 01:54
  • 签到天数: 148 天

    [LV.7]常住居民III

    发表于 2020-3-19 15:42:56 | 显示全部楼层
    感谢教程,非常好
  • TA的每日心情
    奋斗
    前天 00:56
  • 签到天数: 253 天

    [LV.8]以坛为家I

    发表于 2020-3-31 20:57:25 | 显示全部楼层
    新手,装上不会用,才发现又这么好心的朋友出了这么贴心的教程。。。感激涕零
  • TA的每日心情
    开心
    2020-6-5 07:55
  • 签到天数: 42 天

    [LV.5]常住居民I

    发表于 2020-4-9 17:20:55 | 显示全部楼层
    感谢太有用了。
    您需要登录后才可以回帖 登录 | 免费注册

    本版积分规则

    顶部qrcode底部
    关注掌上百科官方微信公众号送积分
    关注掌上百科官方微信公众号
    关注微信公众号 pdawiki,获取邀请码,看文抢积分,抽奖得浮云! Follow our Wechat official account "pdawiki", get invitation codes, and play the lottery to earn points (积分)!

    小黑屋|手机版|Archiver|PDAWIKI |网站地图

    GMT+8, 2021-1-18 11:27 , Processed in 0.035502 second(s), 12 queries , MemCache On.

    Powered by Discuz! X3.4

    Copyright © 2001-2020, Tencent Cloud.

    快速回复 返回顶部 返回列表