给牛客改了一套宽屏CSS
如题,给牛客网改了一套CSS,主要适配讨论区
没办法,程序员的手,闲不住的
开门见山
废话不多说,用户样式需要通过浏览器插件才能安装,既然牛客网平均 Chrome 72 ,那么其实你只需要有一个 stylish 或者 stylus(推荐) 插件即可。
事实上,Tampermonkey / Greasemonkey 等脚本管理器亦可。
地址: 牛客 宽屏优化 + 页面调整
功能简介
牛客网的主要布局区域宽度是 960px 的,实际上我的显示器是 1080p,我也相信其他同学不乏有 2k 甚至 4k 显示器的,那么在这个视区大小下,960 其实就显得有些窄了。
主要 Feature
- 通过媒体查询,当你的视区宽带大于 1440px 时,把主要区域拉长到 1440px。
- 将顶部的牛客网 header 固定,不随窗口滚动,阅读时不占用视区大小。
- 将评论区的楼中楼进行瘦身,同时还缩小了评论区的图片,改为了鼠标放上去时放大。
这一改动主要是为了防止有些图片过大而影响浏览体验 - 将用户 ID 的颜色进行了微调,亮度调低,字号放大,但是保留了原有的颜色,至少不刺眼了。
- 将楼中楼区域的背景色变淡,提高阅读体验。
非主要 Feature
- 可以选择隐藏一些不重要的页面元素,例如广告、例如商业推广。
- 添加了一些无伤大雅的过渡效果。
- 放大了列表页的标题字号。
- 在拉长视区的同时,调整兼容了一下其他模块对1440px的兼容。
重点
以上所有功能,都是 可选的! 可选的!
你可以按照这个图片,自定义你需要的功能:
最后放一张简单的效果图吧:
欢迎大家尝试、使用!
如果有什么建议,可以在评论反馈。
ps:如果你使用Tampermonkey等脚本管理器,请认准: