TA的每日心情 | 衰
2018-6-16 18:13 |
|---|
签到天数: 158 天 [LV.7]常住居民III
|
本帖最后由 Yyang. 于 2018-4-14 22:06 编辑 7 L$ |: p- t$ M( \# [
: C0 E5 c# ]( G, B
$ a/ [# t+ b' ]0 z4 |
2 E# w' N. z3 H0 x$ o9 q$ v本贴需要结合咩妹子的 css 教程连接【CSS教学贴+L大韦氏修改CSS】小白式修改CSS方法) b; R/ k. h4 V1 v" l: x- e/ o
l% x4 M: L# N, f8 Q: Y: ]一千个读者心中有一千个哈姆雷特。
( E0 O& \. @8 w! ?: q; S每一个人对词典的布局都有自己的喜好。
: ^1 W" d6 a, ^6 v1 V0 t3 t# S, ?在手机上的布局不一定在电脑上相同，反之依然。
5 }3 v x) z; `# ]9 M/ S8 u! Y论坛上对css的修改最详细的讲解是咩妹纸的小白教程，咩妹子的 css 教程连接【CSS教学贴+L大韦氏修改CSS】小白式修改CSS方法，但是有些步骤不怎么详细，今天发帖教程。& \1 U3 r4 N7 b
零基础大力丸教程，讲解不多全是图不跳步骤。 Z, F% A# B- G% H5 |% L5 r
3 {) T6 ~9 F8 ^. v' Y/ W: d对下面问题，写出了自己的理解
) @* c0 f8 q8 V* ^# J1.有mdd，但是没有外置的css怎么办？$ d0 J: {( P4 o' Y i, L e
2.没有mdd也没有css怎么办？
; C. B1 G6 J+ I2 @# t3.为什么我在style里面改，但是css里面没有改呢？$ `$ U, p' C% B7 m$ t3 ?
4.如何通过两个排版选择修改自己想要的？! |1 p% z0 I+ I9 J- } ^" P9 d1 B
5.怎么选择一些颜色呢？
: Z3 {0 ]2 K6 ?) ^/ F( u
- D4 c! ?! q' P; O3 L2 M
- X( X1 t0 N3 t. e1 G- |3 R6 X一 需要软件# {% F8 d) x, ^5 M9 h
1.[2018-3-3]MdxExport3.5-MDX与MDD资源导出小工具/ m6 `' K: a7 H% ~% y0 }
https://www.pdawiki.com/forum/thread-17709-1-1.html
9 w1 [4 b" C( Q: W8 L( N2.[MDXBuilder] MdxBuilder 3.0 Beta2
- }) I0 _- v+ K; ^- d" Qhttps://www.pdawiki.com/forum/forum.php?mod=viewthread&tid=3747- R4 s6 w% |! C. r
3.Mdict Editor Tool v2.0.35 -- 多功能个性化词典制作工具( F" q; j5 e; k* N+ V) Q* s
https://www.pdawiki.com/forum/forum.php?mod=viewthread&tid=3747
# e3 j0 Y1 `9 C" P3 U2 a4.emeditor64 百度 C7 B4 L, f' b6 `
5.MDict
& M7 v- b! C& |4 w$ k1 bhttp://www.mdict.cn/wp/?lang=zh! {! L+ Z% o+ A7 m) `
6.Google浏览器
& ], y% |. A/ s+ k s7 |% p7.css相关手册 看附件 密码852963
I4 o, K$ V8 Q5 n8 ` |. o+ |3 @$ B `$ g: B! H
二 步骤
* r& ]' q7 ]% g) A 1.选择我们想要修改的词典，今天选择最有代表性的lang5++，这本ff大的词典有两个js，两个css.* V7 T$ k" {( d8 N: s; R
（说明：1.每一词典几乎都有额外的css，都是这些css有一个或者是多个，这个不需要在意，我们一个个来看
9 r2 R: A/ x! y- D7 `! ~ 2.我们中意的词典只有mdx，mdd没有看见css怎么办？继续看$ c7 D' Q) d# v- J: k9 ^) A5 J: }( V
3.js是控制着展开的，以及动画，lang5++有心人会看见在点击小喇叭时候，小喇叭有阴影）4 ?) [' P" \7 Z
! T1 j8 V4 _+ S
1.第一步，我们需要得到css才可以修改
8 J9 G A, o; Z5 K9 R4 k-说明：没有css怎么办，工具：MdxExport3.5-MDX与MDD资源导出小工具
: K- Q* C8 I) i$ |3 L5 g( H& H, B 1）有mdd，通常css是在里面的 C* a5 n) G$ e$ Z
2）没有mdd，那么css是写在mdx的txt里面的
" `. ^4 v w" u2 s- ?3 _7 H$ P 看图
, R; k2 S( R2 }( q! p$ A& [5 a8 ^* o1 o- z3 v G! Q
; M, l# O- N; c% O% O
$ u- i; n6 ^; m9 E回到文件夹，会看见多出一个文件夹在里面
% H T3 D# }3 h, ~+ V# A: @) N% A
) z/ D4 r, F8 U+ @$ A9 g这里面的就是css（记住这个文件名，到时候你修改后的css名字也是这个，要一致）
! g, W4 Q s( ]0 W) V
3 Y; d6 Q2 T1 s4 H7 G3 L 说明一下2./没有mdd，那么css是写在mdx的txt里面的，下面我们看单单的mdx：英语词根词缀.mdx/' T% g% q" i$ o2 U
# J# q: J( x# Q. T" _4 M6 G' {4 d, U2 ~5 U
使用emedtray打开txt，
+ G4 P4 K' f; J/ j" d- ?. U4 Y
9 ?) i7 V' |; {; z% M+ o对应的是字体的颜色，可以通过/替换/这个功能实现局部的修改, G# t& J6 h8 u$ m& v. f3 K" [2 e! X
. r7 O7 A8 h0 Q( V- x# B8 C
4 B' H- [5 ^) i2 m1 v2.第二步7 I/ I6 }; d. y9 [: w% a) p9 ^
1）提取词典中的单词html的表现形式
7 o; Y+ v. g5 s+ j+ g3 w# _常用单词take，go，principle，for
r% v$ I4 `) r, c2）打开mdict
- ]: _7 q% F5 ?$ u4 N3）安装词库
3 U3 h( T, N" Y4 ~7 H4）提取源$ n% x+ N% @6 a' T# a0 y& H# i# U
+ i& R% T2 n) C7 K8 m, M" S: a+ v! z! M; q& [; N6 [& o
1 H$ t7 k4 L% J5 y
# i+ U; F2 H" Q/ @! s1 N. Z
3.第三步 打开Google浏览器，把刚刚提取的文件导入到狗狗浏览器. l$ b$ _& P0 I5 r& x$ o3 Z( M
6 g9 y, K5 P4 W0 S
: t$ h# k; W* U; h& m# `
按ctrl+shift+i或者在右上角冒号处点击----更多工具----开发者工具/ l. g! b9 ]+ B+ ^; S
1 a `, h8 q- C/ I, Z. h# u1 S1 {2 [% U( _! b6 A' H0 |! r
注意：ff大的css有两个，这两个css分辨控制着不同的排版0 w7 F, }' J, d6 }3 J
我们一一的来使使
7 M. Z5 H: e8 U, }+ N ?我们先试试LM5style.css这个文件，拽入/白白嫩嫩的空白处/* x1 E# w. z# e H, w9 z
说明一下，lang5++的两个css控制的不一样，所以你单单导入LM5style.css这你只能看见部分的排版，尝试把css同时导入/白白嫩嫩的空白处/你就能看见和手机上相似的排版，那我们看看LM5style.css到底是控制的是什么呢？
" D8 ?( o, i+ i5 V+ A9 Q$ J1 N+ T/ e 3 Q; x5 q: D* d: k' f* c- G
9 U6 j7 h3 B% Z+ T U" [9 I! r9 ]9 W8 t9 ?: h# x/ r) x
, O3 o: D3 d# |: R
ctrl+shift+c快捷键6 i+ Q2 [- \8 K# l2 ?9 H c
. j) Q! f Y# S* |" p
隐藏的命令为display：none8 P U7 z3 n- y0 j( M2 c Z. w
% v6 r* _% P# x$ Q1 u- |) s% Y8 A+ o. ~+ b+ O9 E& \. P
问题出现' P# B8 @) Z( F0 U
1 @3 D% M1 b( [6 g4 w% H
8 {* ~; q" s3 h! y0 w
" ]4 D+ c% n3 {" f% e9 v 可能这里css中就没有写入这个class="DEF LDOCE_switch_lang switch_siblings"/ m& t; Y: Z0 o$ {7 V
但是我们可以清楚的看见在Elements中有class="DEF LDOCE_switch_lang switch_siblings"这个那么我们做如下操作
3 o, `$ b" w' X- T( W- Y
: l2 |/ m; [; o& P/ o6 z
4 u' ?$ T% D0 i* L' w" f+ I" Q: i
( j% R( q. E0 Y) S c3 {# w 我们先修改我们理想的样式先，我以修改颜色为例4 K* P7 V4 U% X! i: D# r
% l) J5 _$ t: }
) |8 t0 e( {) [2 z D- `! g$ d3 P# x9 O4 G3 T6 ^
第四步---尝试修改背景颜色4 f: C$ Y- p3 n' c
' A3 x9 q; @ g两个不同排版比较修改
1 P8 E4 g; L1 Y% i* j6 k; c( f& D1 k- l
% m& A. N& u: e, B. ~4 f3 }对于颜色的选择
! \. R# M8 v' g* H通过各大网页选择你喜好的颜色& n9 j) y( w. t* a. Z
( U4 e7 u. Z" f3 b6 U% Q+ N
v$ u( z# C: b# c( n
大爷都读到这里了给一个咱呗，1米2米不嫌少，50，100米来着不拒~6 _5 p# e5 W5 d
7 Q; Y. [" _* u( h
& z- j- p# \; q+ u+ x/ \* m1 Z; G+ K; ~0 k# Q$ T9 ~/ x
|
本帖子中包含更多资源
您需要 登录 才可以下载或查看，没有账号？免费注册
x
评分
-
20
查看全部评分
-
|
[复制链接]
发表于 2018-4-14 21:46:02
楼主
发表于 2018-4-15 16:27:42
K大这回复也太官方了吧，活力一点的版本有没有
摸摸头 哈哈哈
