TA的每日心情 | 衰 2018-6-16 18:13 |
---|
签到天数: 158 天 [LV.7]常住居民III
|
本帖最后由 Yyang. 于 2018-4-14 22:06 编辑 ; P1 f' s7 Y+ _; H
9 C1 Z6 I. p7 X* j- w ?2 O8 a6 l: m+ u4 g" u& Z
! e4 M2 T8 {5 H5 u( c本贴需要结合咩妹子的 css 教程连接【CSS教学贴+L大韦氏修改CSS】小白式修改CSS方法
2 b" l4 e. ]4 M+ W% Y! k$ l& v
2 @& n r9 B6 m, d' w( o P一千个读者心中有一千个哈姆雷特。* {" a9 E- T; Y1 Y6 k4 C# e7 C
每一个人对词典的布局都有自己的喜好。
3 r! U' m6 L# x8 A在手机上的布局不一定在电脑上相同,反之依然。& b# O0 k0 B# Z `
论坛上对css的修改最详细的讲解是咩妹纸的小白教程,咩妹子的 css 教程连接【CSS教学贴+L大韦氏修改CSS】小白式修改CSS方法,但是有些步骤不怎么详细,今天发帖教程。$ [# [7 @2 p/ E4 a& H# a k4 }
零基础大力丸教程,讲解不多全是图不跳步骤。# X' l6 K4 t* r& p6 v
% Q1 V7 h, L6 m$ o对下面问题,写出了自己的理解
% O$ \; W4 X- b I4 s# {1.有mdd,但是没有外置的css怎么办?- l/ u( i/ B. {2 ?
2.没有mdd也没有css怎么办?
) k5 d) _+ g% N; G3.为什么我在style里面改,但是css里面没有改呢?, ?# R" |6 }# r( O" ^, l+ k7 r: z2 j
4.如何通过两个排版选择修改自己想要的?$ A y2 | n7 X0 H5 J$ R$ Q
5.怎么选择一些颜色呢?0 K! b/ A- [5 D8 j; a
/ ?5 J- E8 g! _1 D' ?
3 I5 G, P* i4 t& e; C一 需要软件3 \6 q9 s( Y- K! l0 m3 K9 s
1.[2018-3-3]MdxExport3.5-MDX与MDD资源导出小工具, u* I* d% l1 s7 j/ `
https://www.pdawiki.com/forum/thread-17709-1-1.html
# F/ R3 @, g6 [0 x* M2.[MDXBuilder] MdxBuilder 3.0 Beta2
4 B; k+ h3 ]1 O+ [/ u- f" \https://www.pdawiki.com/forum/forum.php?mod=viewthread&tid=3747/ i) K' z& y! Y- F: x
3.Mdict Editor Tool v2.0.35 -- 多功能个性化词典制作工具- P- M' x: U( s% e3 P
https://www.pdawiki.com/forum/forum.php?mod=viewthread&tid=37475 [8 w$ n% D; @. z, a
4.emeditor64 百度& K) w+ B; e, g/ b
5.MDict
, y4 ^9 P9 I7 t7 n& Nhttp://www.mdict.cn/wp/?lang=zh- \: _$ G8 z* C* ~/ R" L, C) H( s
6.Google浏览器
' z* f, Z9 @. h2 } }* |& [4 U( I. R7.css相关手册 看附件 密码852963
. y: r& d3 X9 v( r
) u, s3 N2 A4 j" ?" Q3 {* b 二 步骤( C# F% ~: x9 x6 E# Z- Y
1.选择我们想要修改的词典,今天选择最有代表性的lang5++,这本ff大的词典有两个js,两个css.
: |- I4 `" d Z; E/ k# x' m9 a(说明:1.每一词典几乎都有额外的css,都是这些css有一个或者是多个,这个不需要在意,我们一个个来看
, N6 K" D- {0 v0 T 2.我们中意的词典只有mdx,mdd没有看见css怎么办?继续看5 x: a& x! [1 a
3.js是控制着展开的,以及动画,lang5++有心人会看见在点击小喇叭时候,小喇叭有阴影), k/ y- c) ?- C; K; L
7 r! n' ]1 M4 F8 U1 H1.第一步,我们需要得到css才可以修改
, ~: Y* u& Q5 L& B. s2 l-说明:没有css怎么办,工具:MdxExport3.5-MDX与MDD资源导出小工具( p, _) b+ S! @! s- o
1)有mdd,通常css是在里面的. I1 T$ ?9 r# ^7 r+ r% N
2)没有mdd,那么css是写在mdx的txt里面的) i* }+ K4 |3 q d
看图, Q/ A9 P1 H: Q. C6 }9 E3 r" m( o& I( {
' @8 t0 p* q+ k& I
. m. O* G0 r- h* r; \3 g! _6 X1 ]# W1 k% n) N
回到文件夹,会看见多出一个文件夹在里面# q- I! m* a0 G
# V. {' V( n- B7 `1 C v( S: ~ b这里面的就是css(记住这个文件名,到时候你修改后的css名字也是这个,要一致)
9 b3 S; Y* E* V6 K) v M0 O! a : m* B6 _1 n( H3 U* L% ]
说明一下2./没有mdd,那么css是写在mdx的txt里面的,下面我们看单单的mdx:英语词根词缀.mdx// j. X! n) f6 f5 Z* D
- Q1 m! N! k A7 }" r
9 g, I- l3 Y/ B/ ` 使用emedtray打开txt,
8 _& I9 u8 ^+ ~: R& H8 a$ o+ P' I) ^% S" `2 z8 A, v
对应的是字体的颜色,可以通过/替换/这个功能实现局部的修改8 u1 Y1 x# C, w7 M2 T
. D+ i! }+ M/ P) c
# q+ [# u2 z3 D+ T
2.第二步
/ {. r B$ d# v3 c4 j, z1)提取词典中的单词html的表现形式: h. ^1 j' b \) R) d. P
常用单词take,go,principle,for, ]6 o, A9 U% W/ T( Y
2)打开mdict+ r' K [$ P. ? A% {: h
3)安装词库
: n3 h) C7 y! i1 @4)提取源4 k4 f& z5 ~, J1 q& j5 H
$ x& r- x2 z8 n4 J% C6 w& J |
& w" c% |) E+ k: e o" x% ]9 j
3 Y3 L+ L" E4 B& m+ V% p. h2 d9 z, W; b; q6 i
3.第三步 打开Google浏览器,把刚刚提取的文件导入到狗狗浏览器
# v3 q( K" s# q8 k0 N) S% s6 y+ I$ m
$ c) s+ ?9 |" @. ]) r( f' {
. ^$ U$ i( f7 S按ctrl+shift+i或者在右上角冒号处点击----更多工具----开发者工具( k6 I4 y( u* J+ G b( K
9 ~+ o. ^) t) W% _* @, D; T( u
. g% X$ t6 v, @% x( E, g, \2 k9 J0 C" G
注意:ff大的css有两个,这两个css分辨控制着不同的排版$ f' r7 S0 W0 D' @% a& N
我们一一的来使使) s* ~+ a+ b |' w: d2 N1 ]& L
我们先试试LM5style.css这个文件,拽入/白白嫩嫩的空白处/
1 M3 \( d# V' ?& G- | 说明一下,lang5++的两个css控制的不一样,所以你单单导入LM5style.css这你只能看见部分的排版,尝试把css同时导入/白白嫩嫩的空白处/你就能看见和手机上相似的排版,那我们看看LM5style.css到底是控制的是什么呢?
. u! L. ^) a" I# K) \% B0 { ; N2 a9 P1 h( l8 ~! M9 t; W
5 h1 j" u" T" _4 i8 b" W5 X
2 U: T6 t* Y4 j% X" r
$ A9 I' Z. j% ~! T! k
ctrl+shift+c快捷键
1 k2 H6 l; W# g$ @8 e5 m8 w" z" Q+ U* J, P6 e; L. D) }3 l4 |1 r
隐藏的命令为display:none/ g, X6 R5 r& W
3 k. y# R% R4 l0 Z: o
) f- [% M* o+ }' L% _/ C) b1 X
问题出现, s3 S2 r5 d: G" k" p2 o
7 C* ?% [: h/ N" r$ c7 [' P4 l/ n, a# \* k2 J/ k# Z2 p; q- ]$ L
3 v2 y* ]/ y% t4 Z2 m7 h- D 可能这里css中就没有写入这个class="DEF LDOCE_switch_lang switch_siblings"
# K0 s. |. U! Y1 M& E6 r" c但是我们可以清楚的看见在Elements中有class="DEF LDOCE_switch_lang switch_siblings"这个那么我们做如下操作
. d: v u3 f$ h5 s" F2 K1 J& o; Q; }4 i$ I3 Z( Z/ U
9 O1 ^7 x4 u8 D+ r
, Y9 e9 Z; T @! U7 L
我们先修改我们理想的样式先,我以修改颜色为例! B, { L3 i! h" H# g
* |/ k% J7 C, K; X. L% r# L1 w0 r( }0 k' P) G. ?
* H+ P4 s; J0 a# K% f7 _第四步---尝试修改背景颜色6 g9 b: A1 ]% ]) _2 \
, S% d, K8 u6 @! b" L
两个不同排版比较修改 Y, C3 g6 V$ ]0 m0 y
. ?" n3 N6 q4 h, P h. V/ L
. f9 t; q3 H( d1 l; W0 Z对于颜色的选择
6 x& x$ s+ g* b5 w. M通过各大网页选择你喜好的颜色
: W, T) C7 X5 O- h1 ]
- z+ H7 B- M% L( v
# z6 b, I" i0 V1 W大爷都读到这里了给一个咱呗,1米2米不嫌少,50,100米来着不拒~
9 g2 ^; I& I9 D5 C! L: v& X
2 j% J9 i1 Y7 ^9 W2 E# a3 y5 I
" z3 ~6 B3 R8 E7 C& B) f! `' C
8 {: j8 B. O1 A7 i* Y, h |
本帖子中包含更多资源
您需要 登录 才可以下载或查看,没有账号?免费注册
x
评分
-
20
查看全部评分
-
|