TA的每日心情 | 衰 2018-6-16 18:13 |
---|
签到天数: 158 天 [LV.7]常住居民III
|
本帖最后由 Yyang. 于 2018-4-14 22:06 编辑 G: I- O7 i f0 U! O3 B
2 J' y! k5 o5 S; z
" h$ n" K2 }% \- Z
9 g3 T6 G: V6 U; _. l' g) Z
本贴需要结合咩妹子的 css 教程连接【CSS教学贴+L大韦氏修改CSS】小白式修改CSS方法$ M6 G+ u9 V. g( ^
9 g2 c1 T- L) w: f, K* X) V) }一千个读者心中有一千个哈姆雷特。
( _) Y6 R" h0 X' y2 u- p6 e& v每一个人对词典的布局都有自己的喜好。/ F# t! E& p. k" A% z& T# A, h: n
在手机上的布局不一定在电脑上相同,反之依然。5 S; v. ]+ Q/ Q" L& P2 s, j
论坛上对css的修改最详细的讲解是咩妹纸的小白教程,咩妹子的 css 教程连接【CSS教学贴+L大韦氏修改CSS】小白式修改CSS方法,但是有些步骤不怎么详细,今天发帖教程。* S1 u2 h9 ?; ~, c
零基础大力丸教程,讲解不多全是图不跳步骤。
! z: }4 N) L7 }7 I8 x1 {5 v
/ u6 v+ C- v) H% D c对下面问题,写出了自己的理解
+ y) P) `4 }7 W/ t {4 ~0 w1.有mdd,但是没有外置的css怎么办?
# D0 ?6 O1 m. W) N0 L2.没有mdd也没有css怎么办?
. m& q9 ]7 }* h3.为什么我在style里面改,但是css里面没有改呢?- Y; @! w/ g4 v+ Y h
4.如何通过两个排版选择修改自己想要的?
- ?' c7 [4 a# G+ z9 h P& ?5.怎么选择一些颜色呢? t9 c8 |5 A# e$ D+ I) Z) n0 U
9 p& R9 ~7 s+ q( d# j& f: J0 y
9 w" }8 Q; o# B- v# [一 需要软件# }9 m+ H3 v, [. O6 S: o% J
1.[2018-3-3]MdxExport3.5-MDX与MDD资源导出小工具& M+ P, W3 R0 q
https://www.pdawiki.com/forum/thread-17709-1-1.html
5 U0 s4 v: N2 V1 l/ t# Y2.[MDXBuilder] MdxBuilder 3.0 Beta2/ @' S1 i& {$ D% a1 \+ R
https://www.pdawiki.com/forum/forum.php?mod=viewthread&tid=3747
' {# X2 P4 ~! X, x" I4 e6 ~3.Mdict Editor Tool v2.0.35 -- 多功能个性化词典制作工具! L, N! R; x9 o. a% X3 b
https://www.pdawiki.com/forum/forum.php?mod=viewthread&tid=3747
$ v8 G( A( E( `; Z$ S) Z4.emeditor64 百度4 L3 b# ^7 D' K1 L5 l
5.MDict
" B: X: L) a, [# d7 ghttp://www.mdict.cn/wp/?lang=zh3 [4 M! J, B3 [8 T( E
6.Google浏览器
4 e& H3 t/ ?; V5 N5 o1 K4 I# v7.css相关手册 看附件 密码852963
3 v1 [% [5 l4 X4 J& P/ s5 D7 H# I% z- v8 ~+ X: v2 }' G. d
二 步骤
- a/ R! ~; q' s2 S/ L5 k 1.选择我们想要修改的词典,今天选择最有代表性的lang5++,这本ff大的词典有两个js,两个css.
0 a) r' m0 o% r8 o, L- o0 i(说明:1.每一词典几乎都有额外的css,都是这些css有一个或者是多个,这个不需要在意,我们一个个来看! h$ B: Y; k* Y4 ]. v
2.我们中意的词典只有mdx,mdd没有看见css怎么办?继续看* y5 o$ C9 c$ [4 `9 D$ B, k
3.js是控制着展开的,以及动画,lang5++有心人会看见在点击小喇叭时候,小喇叭有阴影)6 q+ e% U) Z" k& ~3 R% y
5 i4 ~$ D" c/ A+ i
1.第一步,我们需要得到css才可以修改
; I$ d# h, O; G/ f4 F& i-说明:没有css怎么办,工具:MdxExport3.5-MDX与MDD资源导出小工具& t1 E, A1 G3 e* M% X _& X
1)有mdd,通常css是在里面的6 j7 U3 B$ F G) R! V0 c
2)没有mdd,那么css是写在mdx的txt里面的
2 K$ |) R/ O- G4 |0 v! B2 J% f: X 看图
5 y2 u& h0 ]2 k+ A
& l& L' Y, @3 K; m/ I |
P6 V( h7 |" E7 w& E3 H. f
2 b, _( m2 S3 r回到文件夹,会看见多出一个文件夹在里面
) y6 o' Q& d8 A% J8 C- d: q' i" k W: ?: r. e
这里面的就是css(记住这个文件名,到时候你修改后的css名字也是这个,要一致)
1 T4 ~, t# Y; L0 s1 H/ K! G
5 `: F: f. g8 C2 U, J5 ? 说明一下2./没有mdd,那么css是写在mdx的txt里面的,下面我们看单单的mdx:英语词根词缀.mdx/
9 Z; t3 S3 [( p4 f2 S4 s
: C7 {. e5 Q3 o( j5 t5 R* u0 J) D( q' P. T: w7 W
使用emedtray打开txt,# _9 X$ B* h' e g
) E' J; c3 P* M: {7 g# _对应的是字体的颜色,可以通过/替换/这个功能实现局部的修改6 {7 }; x" d' m
9 b @- r) U, N% y4 y
/ t& T0 a9 V; c$ ?2.第二步5 i q4 O2 K3 J" y( O6 a
1)提取词典中的单词html的表现形式1 D! y) y# J% u- s7 C7 e3 s
常用单词take,go,principle,for
6 \8 z/ R: p0 k. j& H+ ~2)打开mdict& B- Y" n# @& A, f2 {7 u3 q& c
3)安装词库
9 X: S; Y n! ?* U; H; s4)提取源: N! r/ D( V" n+ C/ |7 ?+ Z
, p0 d3 N; D. L
3 e) x+ ]+ ?' e+ r
5 @9 N, x4 e# o: I3 E c2 [7 y7 P6 W( }) l& U, U$ o
3.第三步 打开Google浏览器,把刚刚提取的文件导入到狗狗浏览器
$ \" \1 E P$ ]- q! N- w4 @) D: N5 D$ L- W y8 Y0 t9 Q& o( t
. n2 R2 ?3 i5 e; Y) t, |/ |9 L8 F& D按ctrl+shift+i或者在右上角冒号处点击----更多工具----开发者工具
! k5 q4 D9 z! G. J l, B' ?0 @
- y/ @: t1 p/ W, T
, ^$ h1 d. _- s4 V8 P# ]6 Q7 z注意:ff大的css有两个,这两个css分辨控制着不同的排版) S* d' n5 |' i1 C8 g
我们一一的来使使; \& ]" f. {7 S$ K
我们先试试LM5style.css这个文件,拽入/白白嫩嫩的空白处/2 A. |$ l: v$ \' ~# z1 Q2 m
说明一下,lang5++的两个css控制的不一样,所以你单单导入LM5style.css这你只能看见部分的排版,尝试把css同时导入/白白嫩嫩的空白处/你就能看见和手机上相似的排版,那我们看看LM5style.css到底是控制的是什么呢?
* k( b9 X, L4 P! d. M' t
, k& k* Z/ y1 z' _7 F* C7 S/ n; ?9 v) w& F( B
1 W% T" M& d- [1 [ M: [6 _
* T6 W0 e4 `8 ^: t; d2 ?$ C: X ctrl+shift+c快捷键
; t" e, ~, q3 l* @* _
( A: r8 q# ^# r7 @$ ^0 g' z, h 隐藏的命令为display:none; S3 x: p o w$ [ g2 h6 X
8 [' {- j4 g" Q- q
7 o& P# g2 @8 I& m3 X! L: } 问题出现
4 T! m6 o+ r, E; L J0 N
1 `9 V3 I4 Y. h$ a: j9 C' M+ x$ o; J
4 Q" O' N- C8 i. K. \. K1 J
- t6 v$ }; P6 I9 Q2 f 可能这里css中就没有写入这个class="DEF LDOCE_switch_lang switch_siblings"2 Z3 z; f: |; E7 {1 K4 Z! m* n
但是我们可以清楚的看见在Elements中有class="DEF LDOCE_switch_lang switch_siblings"这个那么我们做如下操作
. o# ~& O9 \+ a0 b% `: w
* M9 ~9 W$ p7 a. h2 S
9 m: Z" ]9 [& M! C* U- ?# S8 E0 z: o! q6 y& ], Z, p3 a
我们先修改我们理想的样式先,我以修改颜色为例4 F7 L _4 D3 ^/ h+ L8 R
8 z" i' H0 n) y3 K) \
( Y4 t9 N' M1 l
8 U) j) M5 { ?; s% g第四步---尝试修改背景颜色
$ u) `, N+ J" R6 | |; h2 s0 I9 T/ \6 j$ i
两个不同排版比较修改' t& {! r7 B7 y/ c. o
6 g) W2 @: S5 y
# |& e! V8 O2 z* R" D; K
对于颜色的选择# s6 W; B" I2 u ]. ~0 I8 l
通过各大网页选择你喜好的颜色+ I* ?( x% @ T* u$ l
) a9 b0 G7 Z' T; Y' h4 c$ H( s. `, t9 q* X, I! j, I5 f
大爷都读到这里了给一个咱呗,1米2米不嫌少,50,100米来着不拒~' Q1 U& R" l8 N, V+ @4 a1 |
% y8 I3 K9 S, _1 _. X% a1 A' M( i
( n5 x# h O% `! r1 X
0 Z, B" t2 Q3 j: N2 Q( r# {7 P |
本帖子中包含更多资源
您需要 登录 才可以下载或查看,没有账号?免费注册
x
评分
-
20
查看全部评分
-
|