【FF版柯林斯2.0】暗夜霓虹主题漆黑中的美

sunset · 发表于 2018-4-6 04:22:11

本帖最后由 sunset 于 2018-4-6 18:32 编辑

做这种黑暗背景风格的排版对我这个new hand来说有点难度，捣鼓了一个小时也制作出了一个版本。

不过，这个版本受到了一定的限制，不知道是我的css代码出了问题，还是欧路词典程序上面有一定的缺陷。
问题是这样的：当我为全局增添黑色背景时，情况如图1 图2 图3，个人觉得挺美观的。但这样做会导致欧路中所有词典的背景都变黑，一些黑字白背景的词典就遭殃了；当我不为全局添加黑色背景，我只为每一个块增添背景时，块与块之间始终无法用黑色填满，会露出白色空隙，影响美观，如图4,图5。不过这样也有个优点，就是不会让其他词典背景变黑。希望专家可以帮我解决这个问题，多谢了。

感谢须佐之男大神的倾力协助，该css的最大问题得到了很好的解决。附件中的css是经过他修改后的版本，喜欢尝鲜的可以下载玩玩。不过个人并不是太推荐本css，一是因为屏幕全黑，会使词典软件的加载速度变慢（从我截取的几张图的大小就知道了，平时的截图大概在500K左右，截个黑色背景的图容量就飙升到了1-2M），二是因为全黑背景做笔记、标注会不太方便。

我的其他排版合辑：https://www.pdawiki.com/forum/fo ... id=25189&extra=

simonfire · 发表于 2018-4-6 09:35:43

本帖最后由须佐之男于 2018-4-6 20:48 编辑

我改了一下，在欧路应该不会影响其他词典了。不过中间有用批量替换，不知道会不会破坏你的布局和样式。

说下我的改动，body, div, ul,等这一大串选择器的背景黑色去掉了，然后类名collinsbody添加黑色背景色，考虑到欧路会给词典添加左右为9px的margin（安卓是这样的），所以给collinsbody添加左右margin为-9px抵消掉（不然两边会有白边），再添加左右padding为9px，保持布局不变。
css选择器前批量加上.collinsbody（避免影响其他词典，考虑到欧路的加载机制，常见标签和类名还是加个限制好点，），这样可能会导致有的选择器失效。

另外你的css文件10行和17行，颜色代码后分别多了个cf和e3，是什么作用？

吴二 · 发表于 2018-4-6 06:01:52

楼主是早起了，还是晚睡了，真是辛勤小蜜蜂，感谢楼主分享！

simonfire · 发表于 2018-4-6 06:24:59

欧路的显示模式是所有加载的词典都在一个页面上，你这么改，影响的不光是背景色，其他同名的类也都受影响。

09rmb · 发表于 2018-4-6 06:39:48

夜晚主题色耶～

zhu1234 · 发表于 2018-4-6 07:37:44

什么新奇样式都能搞出来么？楼主太有才了。

zyj287940120 · 发表于 2018-4-6 09:34:46

我的字体都变黑了。。

medicichen · 发表于 2018-4-6 10:16:34

暗夜中的智慧之光。谢谢楼主分享。

sunset · 发表于 2018-4-6 14:00:08

须佐之男发表于 2018-4-6 09:35
我改了一下，在欧路应该不会影响其他词典了。不过中间有用批量替换，不知道会不会破坏你的布局和样式。

说 ...

哇，厉害了，完美地解决了我遇到的问题。赞一个，我就把你的这个版本放到楼顶了。另外我再去研究一下你的改动。。其实我现在也只会最基础的改动，一涉及到有关代码的东西马上就懵圈了

linnnxt · 发表于 2018-4-6 14:14:07

支持一下，谢谢

simonfire · 发表于 2018-4-6 14:31:18

本帖最后由须佐之男于 2018-4-6 14:41 编辑

sunset 发表于 2018-4-6 14:00
哇，厉害了，完美地解决了我遇到的问题。赞一个，我就把你的这个版本放到楼顶了。另外我再去研究一下你的 ...

其实我也不是很熟悉，只是根据显示情况慢慢调整。
另外我改动的部分上面都说了，你对照去看就行，其实没改很多。
在欧路上，你修改词典的时候，可以尽量用类名或者id来做选择器，这样可以很大程度上避免影响到其他词典。用div、a、p、这些标签的话，前面做好限定。因为欧路就是所有词典放在一个网页上，每个词典相当于一个div。深蓝、mdict就不用考虑这些了。
还有就是修改css、js后，加载增加的时间基本可以忽略不计的（都是以毫秒计算的）。你的截图变大，可能是和色彩有关（我猜的），比如纯黑肯定小于你现在截图的大小。
最后，希望你以后有好的作品分享给大家。

linnnxt · 发表于 2018-4-6 16:24:35

支持一下，谢谢

qiuyouxin · 发表于 2018-5-1 06:27:09

感谢辛苦编辑分享。。。

[改版] 【FF版柯林斯2.0】暗夜霓虹主题漆黑中的美

评分

[改版] 【FF版柯林斯2.0】暗夜霓虹主题 漆黑中的美

评分

[改版] 【FF版柯林斯2.0】暗夜霓虹主题漆黑中的美