[2] 通过 article-style.css 调整跳转词典 JumpToDicts

deeke

2 ~9 j/ B1 X- g) H8 t# c& u6 a170928：更换图例。
------------------------------------------
* s9 i3 R4 y' |4 j
- J- o: `2 q. A9 F1 s# J3 i------------------------------------------
) j- l* A/ l7 `% \$ h, D感谢 ryuya 制作、分享的跳转词典，和 GD 自带的构词法各有用处。
# g! r, f3 s/ I9 [JumpToDicts 3.0 (英語構詞法詞典)
% W6 D4 Y' Q0 I! Z( L: y5 TJumpToDicts (phrase version add-ons)
6 K4 g- Q9 I6 X8 f1 A6 B$ ]" w我的软件环境是：Win8.1 + GoldenDict_Qt5_x64_portable 。

5 R3 ~$ V/ d  y3 J' V0 v词典没有外置 css 文件，所以通过 article-style.css 来曲线修改。直接修改 mdx 文件更方便快捷，但是我们就要在平坦的道路上曲折前进。
+ b' s) `8 s2 y/ H根据来源不同，外框有四种颜色，此信息体现在小箭头（ u279C ）上，并保持一致。
4 Q; O( f7 [6 X; x  D4 N& A9 e
1. 在 GD 里找出词典编号。
" B& m: S, t1 Z. Y2 x. g$ a; `: N9 _鼠标右键“审查元素”，或直接按 F12 。每台电脑的词典编号并不相同。

1. #gdarticlefrom-af6352032a97251d70ce9ba74e88edb8 对应 JumpToDicts 3.0
   
2. #gdarticlefrom-3a6c930edbc61ab69e6c93450b279539 对应 JumpToDicts (phrase version add-ons)

复制代码

2. 修改 GD 的配置文件：“ c:\...\GoldenDict\portable\article-style.css ” 。

1. /* JumpToDicts | Start */
   
2. #gdarticlefrom-af6352032a97251d70ce9ba74e88edb8 .mdict>div,
   2 r9 ~9 i; N: Y6 Y1 @# C
3. #gdarticlefrom-3a6c930edbc61ab69e6c93450b279539 .mdict>div {
   
4.   font-family: Lato, sans-serif !important;
   3 N' U4 E$ t8 Q4 S
5.   font-size: .625rem !important;
   
6.   font-weight: normal !important;
   
7.   font-style: italic;
   4 n9 `; c+ z) u3 b" O
8.   width: auto !important;
   0 g8 @8 q2 {7 R/ k. p
9.   padding: 0 !important;
   7 j( i6 y' o4 E* m/ k
10.   color: gray !important;
    ; T  _1 f, `1 V4 L
11.   border: none !important;
    
12.   border-radius: 0 !important;
    
13.   background-color: transparent !important;
    
14.   box-shadow: none !important;
    
15.   vertical-align: baseline !important;
    % w; A7 [6 T- V8 P! T# F
16. }
    $ I( m# p6 W* d& D/ |0 G! |! T& ^( U
17. #gdarticlefrom-af6352032a97251d70ce9ba74e88edb8 .mdict>div::before,
    6 a1 _  y+ Z- @8 G- H% t: {- U
18. #gdarticlefrom-3a6c930edbc61ab69e6c93450b279539 .mdict>div::before {
    
19.   font-family: "Segoe UI Symbol";
    7 f9 F. P2 Q9 J3 t0 o& [
20.   font-size: .5rem;
    + B/ r6 _6 \! q3 u/ I# k( s
21.   font-style: normal;
    
22.   line-height: 0;
    
23.   position: relative;
    1 A+ `- h! k6 H, y/ u) `. ]+ J
24.   bottom: .0425rem;
    
25.   margin-right: .23rem;
    ! v* d7 Q* \: r' O0 L# K
26.   content: "\279C";
    ) \  T5 v' O/ h: T* N( N
27.   vertical-align: baseline;
    % x# E8 D/ o) B: g4 v- w5 k1 l
28.   color: green;
    
29. }
    + Y/ _6 s3 g- X$ ^- x! c
30. #gdarticlefrom-af6352032a97251d70ce9ba74e88edb8 .mdict>div.MW::before { color: orange; }
    / D$ d) T9 E& L! E& e
31. #gdarticlefrom-af6352032a97251d70ce9ba74e88edb8 .mdict>div.O8::before { color: deeppink; }
    
32. #gdarticlefrom-af6352032a97251d70ce9ba74e88edb8 .mdict>div.spell::before { color: #444444; }
    
33. #gdarticlefrom-3a6c930edbc61ab69e6c93450b279539 .mdict>div.phrase::before { color: #1E8BB7; }
    # c7 x& ~6 }$ \/ L% E
34. #gdarticlefrom-af6352032a97251d70ce9ba74e88edb8 .mdict>br,
    7 k! {% A$ E$ y
35. #gdarticlefrom-3a6c930edbc61ab69e6c93450b279539 .mdict>br { display: none; }
    
36. #gdarticlefrom-af6352032a97251d70ce9ba74e88edb8 .mdict>hr,
    
37. #gdarticlefrom-3a6c930edbc61ab69e6c93450b279539 .mdict>hr { margin: .1rem !important; }
    
38. #gdarticlefrom-af6352032a97251d70ce9ba74e88edb8 a,
    
39. #gdarticlefrom-3a6c930edbc61ab69e6c93450b279539 a {
    
40.   font-size: .875rem !important;
    - J* b6 `/ ]# B4 C
41.   font-weight: bold !important;
    
42.   font-style: normal !important;
    
43.   margin: auto .23rem !important;
    * s0 ^5 t% H; h. I
44.   text-decoration: none !important;
    
45.   color: black !important;
    
46.   border-bottom: .08rem solid transparent !important;
    
47.   outline: none !important;
    
48. }
    " O4 l3 i" Y2 \5 ^7 I
49. #gdarticlefrom-af6352032a97251d70ce9ba74e88edb8 a:link,
    / H+ ~& A2 S& X2 x  ^" K
50. #gdarticlefrom-3a6c930edbc61ab69e6c93450b279539 a:link,
    
51. #gdarticlefrom-af6352032a97251d70ce9ba74e88edb8 a:visited,
    . y6 b0 e) l4 b# u% E! z7 w: W
52. #gdarticlefrom-3a6c930edbc61ab69e6c93450b279539 a:visited { color: black !important; }
    : d3 [7 [2 u4 y+ I( g+ ]' S& L
53. #gdarticlefrom-af6352032a97251d70ce9ba74e88edb8 a:hover,
    
54. #gdarticlefrom-3a6c930edbc61ab69e6c93450b279539 a:hover,
    
55. #gdarticlefrom-af6352032a97251d70ce9ba74e88edb8 a:active,
    0 w2 [- U, _. @8 R  `! P! d. _
56. #gdarticlefrom-3a6c930edbc61ab69e6c93450b279539 a:active {
    ; w2 j8 F7 Y3 V6 k4 F, @
57.   color: black !important;
    
58.   border-bottom-color: black !important;
    6 M: _  u5 l0 h, @9 j
59.   background-color: yellow !important;
    
60. }
    
61. /* JumpToDicts | End */

复制代码

------------------------------------------
修改 dsl 词典的展开按钮
; T) M4 q  w: `5 G1 y- v% D6 ~$ D/ e
1. 在网上找两个图片表示展开、折叠，改名为 expand.png  、 collapse.png  。
1 C) ?  u* ~5 z放入文件夹：“ c:\...\GoldenDict\portable\icons\ ”备用。
) O1 I( r) T% K$ G
2. 修改 GD 的配置文件：“ c:\...\GoldenDict\portable\article-style.css ”。
- F! G7 S3 z. S) M6 V调整各种 前后左右、高矮胖瘦。

1. .dsl_headwords img[src$="expand_opt.png"] { content: url("file:///icons/expand.png"); }
   6 x  R/ n/ p* g* H* V9 x, V- r' B
2. .dsl_headwords img[src$="collapse_opt.png"] { content: url("file:///icons/collapse.png"); }
   ( w* S; E+ q, `
3. .dsl_headwords img[src$="expand_opt.png"],
   
4. .dsl_headwords img[src$="collapse_opt.png"] {
   
5.   line-height: 0 !important;
   
6.   position: relative;
   # @" j! \$ U/ E5 `& j) p
7.   bottom: .125rem;
   & l0 n. J3 q1 h& q- f
8.   left: .475rem;
   
9.   width: .75rem;
   0 E3 ~# S: l8 ~. D) N) R, B5 {2 \
10.   height: .75rem;
    ! m7 r" J; v' V1 i! J
11. }

复制代码

------------------------------------------

搞定收工，试试看外链的图床效果如何。别忘了帮我评分呦~~~

HMPT

GoldenDict_Qt5_x64_portable 这种词典是不是只能放在portable目录??

HMPT

@deeke 好方法!!!!!

deeke

HMPT 发表于 2017-9-21 10:29
. F. I& s0 t  w4 [6 o9 ~@deeke 好方法!!!!!

我比较晚才开始用 GD ，都是从置顶的经验贴学来的。

kandict

谢谢，才知道把词典目录的快捷方式放在content那里也可以。

leescott

请问，直接修改mdx文件，怎么实现？
两个词典放在一个文件夹下。手机深蓝词典。
. }9 r0 F+ ?9 P9 L$ g! R谢谢！