掌上百科 - PDAWIKI

 找回密码
 免费注册

QQ登录

只需一步,快速开始

查看: 4792|回复: 176

[改版] [180725]牛津8英汉双解重排更新

    [复制链接]
  • TA的每日心情
    开心
    2019-1-23 23:12
  • 签到天数: 13 天

    [LV.3]偶尔看看II

    发表于 2018-5-30 01:20:13 | 显示全部楼层 |阅读模式



    7.25 修改多个bug,只需下载css覆盖即可;48楼有相关字体文件
    6.26 隐藏多余空行,只需下载css覆盖即可
    6.12 更新一些细节,只需下载css覆盖即可


    首先感谢:

            EarthWorm精美的牛8:https://www.pdawiki.com/forum/thread-22034-1-5.html
            漫步_roamlog的双解重排:https://www.pdawiki.com/forum/fo ... 2722&fromuid=252908
            dfsfd的官网完美版美化:https://www.pdawiki.com/forum/fo ... 6763&extra=page%3D1
            这部词典排版已经非常完善。本次修改基于dfsfd的版本。
            
            另外感谢 fearfare090807 大神。之前一直想要点击切换的双解词典,自己也尝试做了些DEMO,水平有限功能很简陋:
            https://www.pdawiki.com/forum/forum.php?mod=viewthread&tid=20567
            https://www.pdawiki.com/forum/forum.php?mod=viewthread&tid=20565
            之后fearfare090807大神的帖子一发布,我告诉自己,那就是我要的滑板鞋。
            
            由衷感谢各位的分享。

    一些想法:

            平时自己使用手机较多,在手机较小的屏幕上看起来总是没有电脑上舒服,尝试针对手机屏幕做一点优化:
            1.由于手机屏幕宽度较小而长度较长,改横向内容为【纵向内容】,重排词头等,方便从上到下阅读。
            2.格式化相关内容,用【不同颜色】及【固定的位置】区分出释意、语法、搭配、例句,方便在手机上快速提取信息。
            3.优化间距使不同释义间具有区分度,方便在手机上快速定位。
            4.重点突出解释部分。

    一点尝试
            
            非专业,现学了一点css知识,抛砖引玉供大家探讨哪种排版更适合手机阅读。
            css没有重新写,修改后很乱,在深蓝上进行了测试,只是一个demo,表达下自己排版上的想法,大家可以继续修改完善,也可以根据喜好调整配色,大家有好看的配色也发上来分享下。
            
    DEMO:

            

    无阴影版:

            

    配色参考:

            

            了解一点CSS之后发现,排版根本是个体力活

    购买主题 已有 149 人购买  本主题需向作者支付 10 粒米 才能浏览

    本帖被以下淘专辑推荐:

    该用户从未签到

    发表于 2018-5-30 11:10:41 | 显示全部楼层
    針對手機排版,其實延展來說是做好自適應,能用相對單位的部分儘量用相對單位,就能簡單地取得相對良好的效果。

    评分

    1

    查看全部评分

  • TA的每日心情
    开心
    2020-3-12 11:07
  • 签到天数: 724 天

    [LV.9]以坛为家II

    发表于 2018-6-6 00:28:35 | 显示全部楼层
    动手建议,不错,楼主辛苦,感谢各位达人奉献心得。
  • TA的每日心情
    开心
    2018-1-29 01:48
  • 签到天数: 10 天

    [LV.3]偶尔看看II

    发表于 2018-5-30 13:04:47 | 显示全部楼层
    PurlingNayuki 发表于 2018-5-30 11:10
    & C8 z. A- h. X7 @- `1 z- K針對手機排版,其實延展來說是做好自適應,能用相對單位的部分儘量用相對單位,就能簡單地取得相對良好的效 ...
    3 I' @6 h0 M) k# y
    相对单位根本和手机排版没任何关系的,也没任何帮助。* i8 K0 h; c) w8 e9 n, W# T5 M# N
    那就是解决同一个页面在系统(包括手机)或浏览器下字体整体放大缩小个一两级的问题。
    9 [1 D- D: j) r* K$ \& ^+ j( L" g
    0 |% [& O, K( p! u6 @" v( R1 B浏览器标准字号是16px, 手机还是16px, 相对单位和绝对单位有什么区别吗?间隔并不会缩小的。如果你用GD为标准,那个标准字号是13px, 用相对单位的话到手机上间距反而拉大了。" E1 S7 S5 D) [$ }) q7 W5 `

    . J- m; k4 O+ l1 H; Z3 J. q手机和桌面分辨率差别实在太过巨大,要两边都安排的明白,只有另起一套方案,简单的,比如字典,就在原方案上修补, @media 指令就是作这个的。你去看collins online, oxford online 的css, 全是一大堆这种指令,绝对单位到处都在用。
    ; n! ]- j* x& X2 L. b( s% f2 I6 J6 l
    复杂的,那就完全另起一套全新的方案才行,比如本站。- o$ q) b' [' J4 u/ w3 q% o
  • TA的每日心情
    奋斗
    2019-2-28 11:49
  • 签到天数: 366 天

    [LV.9]以坛为家II

    发表于 2018-5-30 01:39:07 | 显示全部楼层
    看起来很赞啊 谢谢分享
  • TA的每日心情

    2019-9-20 08:37
  • 签到天数: 214 天

    [LV.7]常住居民III

    发表于 2018-5-30 08:04:57 | 显示全部楼层
    很有个性啊
  • TA的每日心情
    开心
    2018-6-18 09:03
  • 签到天数: 110 天

    [LV.6]常住居民II

    发表于 2018-5-30 08:51:01 | 显示全部楼层
    很不错!建议去除阴影效果,或许会更好
  • TA的每日心情
    开心
    2019-1-23 23:12
  • 签到天数: 13 天

    [LV.3]偶尔看看II

     楼主| 发表于 2018-5-30 08:55:27 | 显示全部楼层
    weird 发表于 2018-5-30 08:515 O5 m3 g3 r% e0 n! q# X3 ~& `" I; M
    很不错!建议去除阴影效果,或许会更好

    ! V5 ]; D! ~7 I' w/ c文件夹里有无阴影版
  • TA的每日心情
    慵懒
    6 分钟前
  • 签到天数: 103 天

    [LV.6]常住居民II

    发表于 2018-5-30 09:32:37 | 显示全部楼层
    十年了。主要是在手机上用。
  • TA的每日心情
    开心
    前天 09:12
  • 签到天数: 661 天

    [LV.9]以坛为家II

    发表于 2018-5-30 09:59:56 | 显示全部楼层
    谢谢大侠分享!你的最漂亮!
  • TA的每日心情
    擦汗
    2019-9-19 09:04
  • 签到天数: 36 天

    [LV.5]常住居民I

    发表于 2018-5-30 10:40:00 | 显示全部楼层
    色彩比较丰富,但是总体比较和谐。
  • TA的每日心情
    开心
    2018-6-18 01:07
  • 签到天数: 102 天

    [LV.6]常住居民II

    发表于 2018-5-30 11:40:58 | 显示全部楼层
    PurlingNayuki 发表于 2018-5-30 11:10
    ' X% V9 N' X& o針對手機排版,其實延展來說是做好自適應,能用相對單位的部分儘量用相對單位,就能簡單地取得相對良好的效 ...
    0 y- }! ~2 b8 x* L7 a" Z
    手机紧凑排版最好,可以一次性最大限度看到更多的释义
  • TA的每日心情
    开心
    2018-11-8 16:40
  • 签到天数: 5 天

    [LV.2]偶尔看看I

    发表于 2018-5-30 11:57:04 | 显示全部楼层
    支持下这个排版哈
  • TA的每日心情
    开心
    2019-1-23 23:12
  • 签到天数: 13 天

    [LV.3]偶尔看看II

     楼主| 发表于 2018-5-30 11:57:35 | 显示全部楼层
    PurlingNayuki 发表于 2018-5-30 11:10
    3 f2 _# P& K, Q/ W9 Q. A% m: r針對手機排版,其實延展來說是做好自適應,能用相對單位的部分儘量用相對單位,就能簡單地取得相對良好的效 ...

    - a( `$ c1 D* ]; T. h大神,相对单位怎么使整块内容排版改变,也需要修改display方式吧
  • TA的每日心情
    开心
    2019-1-23 23:12
  • 签到天数: 13 天

    [LV.3]偶尔看看II

     楼主| 发表于 2018-5-30 11:58:57 | 显示全部楼层
    kyletruman 发表于 2018-5-30 11:40, x' V9 W: e: R: ~8 E% G
    手机紧凑排版最好,可以一次性最大限度看到更多的释义
    $ ^$ Q$ f' S" f' j
    没有间距一下砸过来一版内容容易让我头大,个人喜好,不过间距也好改
  • TA的每日心情

    2020-6-20 01:47
  • 签到天数: 241 天

    [LV.8]以坛为家I

    发表于 2018-5-30 12:39:44 | 显示全部楼层
    近来更新了词典才知道这货用着好,可编排真是体力活。为你的付出表示感谢。
  • TA的每日心情
    开心
    2019-1-18 23:55
  • 签到天数: 230 天

    [LV.7]常住居民III

    发表于 2018-5-30 13:05:12 来自手机 | 显示全部楼层
    个人见解,黄底部分和整体风格不搭。而且黑色加粗本来就是非常显眼的样式,加上其他内容又偏浅,所以没必要加个黄底。
  • TA的每日心情
    开心
    2019-1-23 23:12
  • 签到天数: 13 天

    [LV.3]偶尔看看II

     楼主| 发表于 2018-5-30 14:35:10 | 显示全部楼层
    dfliaoyue 发表于 2018-5-30 13:05
    2 [8 n8 ?- U1 z. @/ O3 C2 ^9 O个人见解,黄底部分和整体风格不搭。而且黑色加粗本来就是非常显眼的样式,加上其他内容又偏浅,所以没必要 ...
    & ?+ Q5 ~1 U8 u
    我主要调整的是排版结构,配色方面你可以按自己喜好修改下,css搜索shiyi改color就行,有好看配色截图回复分享下哈
  • TA的每日心情

    2018-6-16 00:08
  • 签到天数: 197 天

    [LV.7]常住居民III

    发表于 2018-5-30 14:43:53 | 显示全部楼层
    有点意思,排版以便好用、易用,这个很关键哈。
  • TA的每日心情
    无聊
    2018-6-8 12:49
  • 签到天数: 16 天

    [LV.4]偶尔看看III

    发表于 2018-5-30 14:52:03 | 显示全部楼层
    这种重体力活要大力支持的!
  • TA的每日心情
    开心
    2 小时前
  • 签到天数: 817 天

    [LV.10]以坛为家III

    发表于 2018-5-30 17:51:06 | 显示全部楼层
    不错还可以,颜色还可以低调点谢谢。
  • TA的每日心情
    开心
    2020-10-16 08:28
  • 签到天数: 527 天

    [LV.9]以坛为家II

    发表于 2018-5-30 18:19:47 | 显示全部楼层
    排版看着很不错,楼主辛苦了
  • TA的每日心情
    开心
    2020-10-5 12:42
  • 签到天数: 371 天

    [LV.9]以坛为家II

    发表于 2018-5-30 20:03:01 | 显示全部楼层
    谢谢你的辛苦付出!
  • TA的每日心情
    开心
    2018-6-23 07:58
  • 签到天数: 136 天

    [LV.7]常住居民III

    发表于 2018-5-31 08:22:59 来自手机 | 显示全部楼层
    排版美观,继续加油!

    该用户从未签到

    发表于 2018-5-31 10:19:04 | 显示全部楼层
    That's very interesting!
    您需要登录后才可以回帖 登录 | 免费注册

    本版积分规则

    顶部qrcode底部
    关注掌上百科官方微信公众号送论坛充值码
    关注掌上百科官方微信公众号
    关注微信公众号 pdawiki,获取邀请码,看文抢积分,抽奖得浮云! Follow our Wechat official account "pdawiki", get invitation codes, and play the lottery to earn points (积分)!

    小黑屋|手机版|Archiver|PDAWIKI |网站地图

    GMT+8, 2020-10-24 10:46 , Processed in 0.081339 second(s), 13 queries , MemCache On.

    Powered by Discuz! X3.4

    Copyright © 2001-2020, Tencent Cloud.

    快速回复 返回顶部 返回列表