# 新牛津2nd2.4【CSS】2019.12.20

**URL:** <https://forum.freemdict.com/t/topic/438>\
**Category:** 英汉\
**Tags:** css\
**Created:** [2019 年12 月 15 日 15:46 UTC](https://forum.freemdict.com/t/topic/438 "2019-12-15T15:46:32Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![Freemdict](https://forumcdn.freemdict.com/user_avatar/forum.freemdict.com/freemdict/32/36_2.png) [@Freemdict](https://forum.freemdict.com/u/Freemdict)\
**Post date:** [2019 年12 月 15 日 15:46 UTC](https://forum.freemdict.com/t/topic/438/1 "2019-12-15T15:46:33Z")

</div>

[![](https://forumcdn.freemdict.com/uploads/default/original/1X/4a4c5d5146bbba41d2519adad859f2d780029907.jpeg)](https://imgse.com/i/QhMiTA)  
[![](https://forumcdn.freemdict.com/uploads/default/original/1X/0eae749d514a235a9a36ca91e985f2ce4599cf35.jpeg)](https://imgse.com/i/QhMPwd)

[![](https://forumcdn.freemdict.com/uploads/default/original/1X/97ebf031a8633ff1c4a17c529a23347e31d33f71.jpeg)](https://imgse.com/i/QhMCeH)

[![](https://forumcdn.freemdict.com/uploads/default/original/1X/b99abedf57f081239597b34cd91859741fa65005.jpeg)](https://imgse.com/i/QhKxSK)

[![](https://forumcdn.freemdict.com/uploads/default/original/1X/54c0f117dcb927ee55489593d3de90b2c5afef9f.gif)](https://imgse.com/i/QhKkxU)

[![](https://forumcdn.freemdict.com/uploads/default/original/1X/526bdb4f152e8e0da46e9acf9c4071c0863297ca.gif)](https://imgse.com/i/QhKEMF)

[![](https://forumcdn.freemdict.com/uploads/default/original/1X/5385f3ee4b1793ed434185031239fc474a3f4131.gif)](https://imgse.com/i/QhKVr4)

# 初版。。。之前的排版整齐有序，被我整得毫无次序，哈哈，不管啦~

# 词典内有作者，请作学习之用途

# (2019.12.15) 初步排版了一下，把词性跳转，词频，翻译全部打开，虽然还有些问题，哈哈，还能用。

# 点击下载:

# [新牛津2nd2.4](https://pan.baidu.com/s/10Zk5uWa1YgdbMzIhZ5MWGA)

# 提取码: 32tr

# 去动画，按住翻译，主要用于PC，有些朋友困扰于鼠标划过产生的“麻烦”。。。

[2019.12.20去动画按住翻译.zip](https://forum.freemdict.com/uploads/short-url/kEtNLUZrS0V757M6Gs1eewRfw8T.zip) (5.2 KB)

---

<div class="post-metadata">

**Author:** ![endnote](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/e/9de0a6/32.png) [@endnote](https://forum.freemdict.com/u/endnote)\
**Post date:** [2019 年12 月 16 日 03:35 UTC](https://forum.freemdict.com/t/topic/438/2 "2019-12-16T03:35:24Z")

</div>

谢谢分享。挺不错的，对css越来越得心应手了。

建议排ODE 3/e 双解版 英汉切换版 (20191225)

> **[提示信息 - 掌上百科 - PDAWIKI - Powered by Discuz!](https://www.pdawiki.com/forum/thread-37804-1-1.html)**
>
> ,掌上百科 - PDAWIKI

此帖还有FF的ODE Living Online的添加双解 中文释义

> **[【尝试】ODE 3/e 添加双解 中文释义 - MDict 词库资源区 - MDict Dictionaries - 掌上百科 - PDAWIKI -...](https://www.pdawiki.com/forum/thread-34955-1-1.html)**
>
> 基于@klwo2强烈推荐原版ODE，因此尝试把双解版中的释义添加进来（主要def+example两块）：原版采用：dfliaoyue的【新瓶装旧酒】ODE 3/e (20190212)双解采用：drongh的新 ... 【尝试】ODE 3/e 添加双解 中文释义 ,掌上百科 - PDAWIKI

这个2.3.1双解比英文版少了很多内容，这些辅助内容对于英语立体学习挺有用的，但国内出版的双解原版由于篇幅、成本所限去掉了。所以说Online版添加中文释义是最好的版本

---

<div class="post-metadata">

**Author:** ![Freemdict](https://forumcdn.freemdict.com/user_avatar/forum.freemdict.com/freemdict/32/36_2.png) [@Freemdict](https://forum.freemdict.com/u/Freemdict)\
**Post date:** [2019 年12 月 16 日 08:02 UTC](https://forum.freemdict.com/t/topic/438/3 "2019-12-16T08:02:14Z")

</div>

啊，你总能找到好词典，我好久没关注新发的词典啦，谢谢提供信息。  
我稍后看看。

---

<div class="post-metadata">

**Author:** ![star](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/ad7895/32.png) [@star](https://forum.freemdict.com/u/star)\
**Post date:** [2019 年12 月 16 日 14:49 UTC](https://forum.freemdict.com/t/topic/438/4 "2019-12-16T14:49:54Z")

</div>

![image](https://forumcdn.freemdict.com/uploads/default/original/1X/00c4fd82debe495e96d0a1f811657fe556453705.jpeg)

1. 如图，右侧没显示完全
2. 然后有个奇怪的现象，我正好装了论坛里的 [Macmillan British English Dictionary 2019 部分双解版 12.08](https://forum.freemdict.com/t/topic/380),点击蓝色的按钮会跳转到该字典去，如果把MBE2019双解删了，则跳转正常
3. 最后能否出个不要鼠标焦点显示效果的版本。。。  
以上，瑟瑟

---

<div class="post-metadata">

**Author:** ![Freemdict](https://forumcdn.freemdict.com/user_avatar/forum.freemdict.com/freemdict/32/36_2.png) [@Freemdict](https://forum.freemdict.com/u/Freemdict)\
**Post date:** [2019 年12 月 16 日 14:53 UTC](https://forum.freemdict.com/t/topic/438/5 "2019-12-16T14:53:42Z")

</div>

哈哈，好像有些平台是有些兼容性问题，最烦这个了，再排个版本吧，mac的单词那一行浮动到顶部么？（就是这张图片的Tell /tel/ 这一行应该是向下移动会置顶的）  
调这个算啦，鼠标那个  
/\* 蓝 \*/

> .spanel {  
> right:0px;  
> }  
> /\* 红 _/  
> .panel {  
> right:0px;  
> }  
> /_ 鼠标-翻译(删除) \*/  
> div.example\>p.en:hover+[p.cn](http://p.cn) {  
> display: block !important;  
> position: absolute;  
> background-color: white;  
> z-index: 1;  
> opacity: 0.9;  
> color: #1e1e1e;  
> font-weight: bold;  
> width: calc(100% - 4.1em);  
> box-shadow: -1px 0px 12px #c5c5c5;  
> animation: blk 0.3s linear;  
> -webkit-animation: blk 0.3s linear;  
> transition: 0.4s;  
> padding: 4px 12px;  
> margin:0px 0px 0px 16px !important;  
> }  
> .sub\_defs.ssingle div.example\>p.en:hover+[p.cn](http://p.cn) {  
> display: block !important;  
> position: absolute;  
> background-color: white;  
> z-index: 1;  
> opacity: 0.9;  
> color: #1e1e1e;  
> font-weight: bold;  
> width: calc(100% - 7.1em);  
> box-shadow: -1px 0px 12px #c5c5c5;  
> animation: blk 0.3s linear;  
> -webkit-animation: blk 0.3s linear;  
> transition: 0.4s;  
> padding: 4px 12px;  
> margin: 0px 0px 0px 16px !important;  
> }  
> .phrase div.example\>p.en:hover+[p.cn](http://p.cn) {  
> display: block !important;  
> position: absolute;  
> background-color: white;  
> z-index: 1;  
> opacity: 0.9;  
> color: #1e1e1e;  
> font-weight: bold;  
> width: calc(100% - 7.1em);  
> box-shadow: -1px 0px 12px #c5c5c5;  
> animation: blk 0.3s linear;  
> -webkit-animation: blk 0.3s linear;  
> transition: 0.4s;  
> padding: 4px 12px;  
> margin: 0px 0px 0px 16px !important;  
> }

---

<div class="post-metadata">

**Author:** ![star](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/ad7895/32.png) [@star](https://forum.freemdict.com/u/star)\
**Post date:** [2019 年12 月 16 日 14:58 UTC](https://forum.freemdict.com/t/topic/438/6 "2019-12-16T14:58:05Z")

</div>

![image](https://forumcdn.freemdict.com/uploads/default/original/1X/26a8f40b45dffadd4bdc9705b64ff1ae39ff82e9.jpeg)  
tell词头那一行不会动，但是下面的悬浮会被下一行的遮挡，希望下一版能把这个效果去掉可以么？

还有那个蓝色按钮调整到其他词典的问题，你那不会嘛？

---

<div class="post-metadata">

**Author:** ![Freemdict](https://forumcdn.freemdict.com/user_avatar/forum.freemdict.com/freemdict/32/36_2.png) [@Freemdict](https://forum.freemdict.com/u/Freemdict)\
**Post date:** [2019 年12 月 16 日 15:01 UTC](https://forum.freemdict.com/t/topic/438/7 "2019-12-16T15:01:52Z")

</div>

哈哈，我没Mac，Mac真漂亮！  
其实这个冲突，我不明白什么原因。。。  
o(╥﹏╥)o

---

<div class="post-metadata">

**Author:** ![star](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/ad7895/32.png) [@star](https://forum.freemdict.com/u/star)\
**Post date:** [2019 年12 月 16 日 15:18 UTC](https://forum.freemdict.com/t/topic/438/8 "2019-12-16T15:18:00Z")

</div>

![image](https://forumcdn.freemdict.com/uploads/default/original/1X/b74b02212459fa56410996c5f6356923449ae1f5.jpeg)  
这个红色在哪里改？我改了css里的1223行的right:15px，但是只对蓝色生效了

---

<div class="post-metadata">

**Author:** ![Freemdict](https://forumcdn.freemdict.com/user_avatar/forum.freemdict.com/freemdict/32/36_2.png) [@Freemdict](https://forum.freemdict.com/u/Freemdict)\
**Post date:** [2019 年12 月 16 日 15:24 UTC](https://forum.freemdict.com/t/topic/438/9 "2019-12-16T15:24:15Z")

</div>

# 改这两个吧

> /\* 蓝 \*/  
> .spanel {  
> right:0px;  
> }

> /\* 红 _/  
> .panel {  
> right:0px;  
> }_

 

_另外，你觉得间距还有问题么？_

---

<div class="post-metadata">

**Author:** ![star](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/ad7895/32.png) [@star](https://forum.freemdict.com/u/star)\
**Post date:** [2019 年12 月 16 日 15:26 UTC](https://forum.freemdict.com/t/topic/438/10 "2019-12-16T15:26:29Z")

</div>

> [@Freemdict](#):
>
> /\* 蓝 \*/

 ![image](https://forumcdn.freemdict.com/uploads/default/original/1X/b3d1092b464f111054073b0a97fdf8069c707475.png) ![image](https://forumcdn.freemdict.com/uploads/default/original/1X/9d8a447e5d2b9118e5248b123db9cea82da23a0b.png) 这两个对吧？

---

<div class="post-metadata">

**Author:** ![Freemdict](https://forumcdn.freemdict.com/user_avatar/forum.freemdict.com/freemdict/32/36_2.png) [@Freemdict](https://forum.freemdict.com/u/Freemdict)\
**Post date:** [2019 年12 月 16 日 15:30 UTC](https://forum.freemdict.com/t/topic/438/11 "2019-12-16T15:30:21Z")

</div>

都是单独的.spanel和.panel  
一个是红，一个是蓝

---

<div class="post-metadata">

**Author:** ![star](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/ad7895/32.png) [@star](https://forum.freemdict.com/u/star)\
**Post date:** [2019 年12 月 16 日 15:31 UTC](https://forum.freemdict.com/t/topic/438/12 "2019-12-16T15:31:50Z")

</div>

![image](https://forumcdn.freemdict.com/uploads/default/original/1X/3f44380d3765ba71d61f3d180f5e8a28197cd1d3.png) 这是红色调成15，蓝色调成20的效果，然后鼠标那个不止那3段要注释，  
总算调完了，谢谢

---

<div class="post-metadata">

**Author:** ![Freemdict](https://forumcdn.freemdict.com/user_avatar/forum.freemdict.com/freemdict/32/36_2.png) [@Freemdict](https://forum.freemdict.com/u/Freemdict)\
**Post date:** [2019 年12 月 16 日 15:33 UTC](https://forum.freemdict.com/t/topic/438/13 "2019-12-16T15:33:55Z")

</div>

# 哈哈，不好意思，忘了一段。。。

> div.example\>p.en:hover {  
> display: block !important;  
> background-color: white;  
> z-index: 1;  
> opacity: 0.9;  
> color: #1e1e1e;  
> font-weight: bold;  
> box-shadow: -1px 0px 12px #c5c5c5;  
> animation: blk 0.4s linear;  
> -webkit-animation: blk 0.4s linear;  
> transition: 0.4s;  
> padding:4px 24px;  
> }

---

<div class="post-metadata">

**Author:** ![star](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/ad7895/32.png) [@star](https://forum.freemdict.com/u/star)\
**Post date:** [2019 年12 月 16 日 15:35 UTC](https://forum.freemdict.com/t/topic/438/14 "2019-12-16T15:35:02Z")

</div>

还有下面一段，一共三段

 ![image](https://forumcdn.freemdict.com/uploads/default/original/1X/cc41e62e255d97d84140243389862b8f4f25f5c5.png)

---

<div class="post-metadata">

**Author:** ![Freemdict](https://forumcdn.freemdict.com/user_avatar/forum.freemdict.com/freemdict/32/36_2.png) [@Freemdict](https://forum.freemdict.com/u/Freemdict)\
**Post date:** [2019 年12 月 16 日 15:37 UTC](https://forum.freemdict.com/t/topic/438/15 "2019-12-16T15:37:01Z")

</div>

哈哈，Hover在Mac是有什么不对么 ლ(′◉❥◉｀ლ)  
用Hover也是不想动Mdx了，其实CSS实现点击效果还是比较简单的。

---

<div class="post-metadata">

**Author:** ![star](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/ad7895/32.png) [@star](https://forum.freemdict.com/u/star)\
**Post date:** [2019 年12 月 16 日 15:38 UTC](https://forum.freemdict.com/t/topic/438/16 "2019-12-16T15:38:54Z")

</div>

是会遮挡，然后可能字典太多了，会有点延迟，所以索性去掉好了

然后如果是可以实现单句点击切换双解，那这当然是最好了哈哈，希望下个版本可以出个点击版？

---

<div class="post-metadata">

**Author:** ![Freemdict](https://forumcdn.freemdict.com/user_avatar/forum.freemdict.com/freemdict/32/36_2.png) [@Freemdict](https://forum.freemdict.com/u/Freemdict)\
**Post date:** [2019 年12 月 16 日 15:41 UTC](https://forum.freemdict.com/t/topic/438/17 "2019-12-16T15:41:29Z")

</div>

Hover有时候是有点头疼，手机轻点，遮挡的部分，点击或hover中文翻译，上一个例句会小时。  
点击的话要改内部的HTML的内联CSS和标签，牛津9OL版有个标签改改就可以完全改颜色样式了，不搞了，改几部喜欢的词典，过得去就行啦 o(╥﹏╥)o

---

<div class="post-metadata">

**Author:** ![star](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/ad7895/32.png) [@star](https://forum.freemdict.com/u/star)\
**Post date:** [2019 年12 月 16 日 15:42 UTC](https://forum.freemdict.com/t/topic/438/18 "2019-12-16T15:42:15Z")

</div>

嗯，这样已经很满足了，谢谢了~~~

---

<div class="post-metadata">

**Author:** ![Freemdict](https://forumcdn.freemdict.com/user_avatar/forum.freemdict.com/freemdict/32/36_2.png) [@Freemdict](https://forum.freemdict.com/u/Freemdict)\
**Post date:** [2019 年12 月 16 日 15:43 UTC](https://forum.freemdict.com/t/topic/438/19 "2019-12-16T15:43:54Z")

</div>

哈哈，长期看词典的话，还得排得清晰明了 (^o^)/~

---

<div class="post-metadata">

**Author:** ![star](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/ad7895/32.png) [@star](https://forum.freemdict.com/u/star)\
**Post date:** [2019 年12 月 16 日 15:45 UTC](https://forum.freemdict.com/t/topic/438/20 "2019-12-16T15:45:15Z")

</div>

那就麻烦大佬你了哈哈哈

对了，字体文件也是放到同一个目录层级下就可以了嘛？

[下一页](https://forum.freemdict.com/t/topic/438.md?page=2)
