TA的每日心情 | 衰 2018-6-16 18:13 |
---|
签到天数: 158 天 [LV.7]常住居民III
|
本帖最后由 Yyang. 于 2018-4-14 22:06 编辑
# D/ l" y% L8 c0 A& p7 X$ O) T a" w$ l
( F- z& T# y8 I7 o( l
3 r. z3 A4 r4 v( K* v
本贴需要结合咩妹子的 css 教程连接【CSS教学贴+L大韦氏修改CSS】小白式修改CSS方法! _1 v2 Z" _! u
2 g% J- m& b$ l3 Z. n0 H9 z1 X一千个读者心中有一千个哈姆雷特。
6 d+ ]1 w3 P4 a每一个人对词典的布局都有自己的喜好。
/ [+ x0 U9 b- k. S& d/ c在手机上的布局不一定在电脑上相同,反之依然。
3 d* w# ]* Q w/ @% q+ n论坛上对css的修改最详细的讲解是咩妹纸的小白教程,咩妹子的 css 教程连接【CSS教学贴+L大韦氏修改CSS】小白式修改CSS方法,但是有些步骤不怎么详细,今天发帖教程。
% X' [+ I# \! Y' w8 F零基础大力丸教程,讲解不多全是图不跳步骤。! j) h0 e# e+ T3 P" e. z
2 D& L6 _8 U+ ^* P7 g. X对下面问题,写出了自己的理解
) \/ S1 _5 k/ h* ^7 v1.有mdd,但是没有外置的css怎么办?4 H% [+ u: w! X0 q8 j% D4 K
2.没有mdd也没有css怎么办?
3 Y7 @& r9 d8 E8 s* b3.为什么我在style里面改,但是css里面没有改呢?/ Q* H1 z. {5 I: ]% y1 L7 _
4.如何通过两个排版选择修改自己想要的?3 i; m- ~" ^7 t \' e' y9 m
5.怎么选择一些颜色呢?6 X6 s; o/ w9 i& V
+ Q7 t( Z3 N. D% I( U" s x
, o2 _2 E# u8 `" Y$ Q一 需要软件
" @0 a0 z2 R/ L0 u4 G& U1.[2018-3-3]MdxExport3.5-MDX与MDD资源导出小工具5 t0 Y2 c0 S: F4 x+ x
https://www.pdawiki.com/forum/thread-17709-1-1.html
0 H# r, [+ S6 T2.[MDXBuilder] MdxBuilder 3.0 Beta29 f/ @/ u: _2 C& n, N {7 X, z0 @. _
https://www.pdawiki.com/forum/forum.php?mod=viewthread&tid=3747
/ i# t! X' j* t0 q0 m1 ^. t: w: y3.Mdict Editor Tool v2.0.35 -- 多功能个性化词典制作工具
* C; \8 n9 ^7 h4 dhttps://www.pdawiki.com/forum/forum.php?mod=viewthread&tid=37479 P0 o5 l1 r$ j) k" c
4.emeditor64 百度( A- x6 [* A- j& }
5.MDict
$ D; E( Z6 L; S; j2 V, nhttp://www.mdict.cn/wp/?lang=zh
' ]( e; C* v3 `7 U/ h, ?6.Google浏览器
Z( @- k% J, {7.css相关手册 看附件 密码8529635 G4 s" e4 @+ q. C
y; G" ] F8 O. F' ?) N
二 步骤. N) b, Y1 o* u' N& q* K
1.选择我们想要修改的词典,今天选择最有代表性的lang5++,这本ff大的词典有两个js,两个css.
- S# R% S6 C* B% f+ d(说明:1.每一词典几乎都有额外的css,都是这些css有一个或者是多个,这个不需要在意,我们一个个来看
6 A9 y7 P( ^. _+ P 2.我们中意的词典只有mdx,mdd没有看见css怎么办?继续看" e8 s& J! B$ s! Q
3.js是控制着展开的,以及动画,lang5++有心人会看见在点击小喇叭时候,小喇叭有阴影): h5 B; E5 ~& h
5 h, {/ y" N0 v
1.第一步,我们需要得到css才可以修改+ P- `/ M- E: h/ ^. W1 R- C
-说明:没有css怎么办,工具:MdxExport3.5-MDX与MDD资源导出小工具
' a- s+ o! d: F% ? 1)有mdd,通常css是在里面的
6 a* _: i/ T2 Q% S6 R: F2 S0 w5 @ 2)没有mdd,那么css是写在mdx的txt里面的* \ r4 o+ b" R6 @
看图
7 M. c) ~, Z( B% I% s
* x0 _$ o9 y" _
) e* H. O. d4 o
+ [; a5 }# { d3 q; T. W& z回到文件夹,会看见多出一个文件夹在里面
2 D, t" u2 X6 {7 \3 c0 ^' g# h6 v1 A- r3 t. U- T2 ` |( l% k
这里面的就是css(记住这个文件名,到时候你修改后的css名字也是这个,要一致)$ Q7 P( r1 b9 Y3 b& y/ W
# S9 G; j [& V8 ` A L3 ? 说明一下2./没有mdd,那么css是写在mdx的txt里面的,下面我们看单单的mdx:英语词根词缀.mdx/! B- _ w3 l! c/ {: E
6 k% l0 S1 G. p/ p2 x0 _" B" D
) M" @+ c! t6 r- X. l/ c$ A B& s 使用emedtray打开txt,5 I8 H7 R* @- ~) d
& ?2 B* s7 ^ W6 `" a- L
对应的是字体的颜色,可以通过/替换/这个功能实现局部的修改* Z( }) k, l' I) t2 j7 ]
/ E9 { Z) ]7 W( i% j) z
% p8 s K, }! H2.第二步$ i: r: A7 j! c0 O$ k
1)提取词典中的单词html的表现形式+ N1 Y5 u# q- u7 H Q
常用单词take,go,principle,for
" {& `6 A# O8 q- ~) ?/ I2)打开mdict
* Q, Z! T: f, X5 |3)安装词库4 p! [" D7 A) Q/ n" }0 \1 S% K$ o. o
4)提取源
. v! k9 p2 A z
$ ^8 L3 }" @, W
( v+ A8 s6 c& Z& A! m0 V8 J: a; ?# h* P4 h1 _9 ]
v c% z9 [+ t% J. N% U, m5 }3.第三步 打开Google浏览器,把刚刚提取的文件导入到狗狗浏览器
& h7 S1 l% l7 J6 L3 o2 ^
) I* Z6 E" O6 K( i
7 r: T& q2 q; E/ x按ctrl+shift+i或者在右上角冒号处点击----更多工具----开发者工具, S8 M2 q: w8 P) E% R& ?4 b0 ^ j) R
1 `7 L/ c7 m) I% k
( R/ t2 n- c- h1 {3 a注意:ff大的css有两个,这两个css分辨控制着不同的排版
# E6 e5 V3 o9 X7 d6 x; T6 ?我们一一的来使使
7 J2 k+ Z. c. k: v& o5 \& C# ]我们先试试LM5style.css这个文件,拽入/白白嫩嫩的空白处/
& T/ ?, S! X$ i M 说明一下,lang5++的两个css控制的不一样,所以你单单导入LM5style.css这你只能看见部分的排版,尝试把css同时导入/白白嫩嫩的空白处/你就能看见和手机上相似的排版,那我们看看LM5style.css到底是控制的是什么呢?0 `, O2 H, O7 \: J U
7 h0 B' G$ U& t3 k2 q; w
# w* I! m: u8 `3 w" L0 E0 u( Y# G
: @; i( O. T! @. h+ m- W) w% D ctrl+shift+c快捷键
& H1 I" b1 @5 w
% s, @5 }- H/ \! h4 h/ { 隐藏的命令为display:none) G7 b i( [: @" j& T" B, F
' C6 ~. [# r' i4 C! Z
- a3 ~& \' q& n$ C3 n. X 问题出现
5 I) l* ]: ^+ Y6 n
- G+ J/ v2 h7 E" |- M' Z: T# y* k8 L. K- D- |( d6 c2 R/ Z0 F$ ?
0 U2 m) p( w/ y/ j6 a/ G 可能这里css中就没有写入这个class="DEF LDOCE_switch_lang switch_siblings": p! c1 P% b% W9 O
但是我们可以清楚的看见在Elements中有class="DEF LDOCE_switch_lang switch_siblings"这个那么我们做如下操作
' {& U2 Q; O+ W, d4 [/ p
7 Q$ ]; m4 @, v( y' M4 Q7 O# w" Y: j0 P; W* }$ p% l- ~9 U
" D0 \) {6 b* x k! { 我们先修改我们理想的样式先,我以修改颜色为例
}5 y. M/ m; O
3 [4 r% G4 y! z/ R8 D; |. _4 v& q. r( b. I
2 N: ]# L. i" B b: |( O- w4 W4 I
第四步---尝试修改背景颜色! A, @5 J0 r3 S! Y. [0 v1 |
# ^/ C5 w! M) Y两个不同排版比较修改
% ]2 e5 ?1 [" _; g8 @; f
; q1 t: m1 E2 v4 J# j. `+ _! `
: |0 Z! y; V% Q2 W9 h7 C对于颜色的选择1 g$ n+ i, A2 v/ J
通过各大网页选择你喜好的颜色
& M b% N: u# n! e8 N/ E) W) Z5 |- i! d, \! n
/ T. \/ ?9 X- i# W( z% @4 o* L
大爷都读到这里了给一个咱呗,1米2米不嫌少,50,100米来着不拒~, m* q; t1 ?1 h& O' G
2 E1 }1 x: t* M0 F- v& m' D- U* I/ z; N
' n" ?% H+ O5 i9 g; N; C( u, C$ V( h
|
本帖子中包含更多资源
您需要 登录 才可以下载或查看,没有账号?免费注册
x
评分
-
20
查看全部评分
-
|