神代綺凜

[Bilibili-Style] 哔哩哔哩 Nekopara B站网页萌化主题
最后更新时间:2019-03-05 这一天,我终于想起了自己的 userstyles 帐号,并增加了新版播放器页面的样式
扫描右侧二维码阅读全文
02
2017/09

[Bilibili-Style] 哔哩哔哩 Nekopara B站网页萌化主题

最后更新时间:2019-03-05

这一天,我终于想起了自己的 userstyles 帐号,并增加了新版播放器页面的样式

Bilibili萌化 ネコパラ

临近毕业事情较多

完事打算推倒重写? <- 对不起,我觉得我咕定了

目前状态

已经基本稳定√
大部分萌化已完成,今后有时间有新点子会一点点添加并完善。

如果发现了什么问题,或者有好的功能及外观建议,可以在这里反馈,这样我就能第一时间收到。
由衷感谢发现问题和提出意见建议的各位,以及正在使用这个萌化的你我TA。

效果预览

视频大小约12MB

使用

需要先安装 Stylus 插件

并建议在 Stylus 插件设置中开启“通过 HTML[stylus-iframe] 方式改变 iframes 的 css”,可解决本样式造成的部分 iframe 背景问题

插件设置可通过 右击 Stylus 插件图标 - 选项 来进入

查看截图/更新日志以及安装:

样式目前应用的情况

  • 大部分UI
  • B站主页(暂不包括视频分类主页)
  • 视频播放界面(普通视频 & 番剧 & 稍后再看)
  • 动态
  • 空间
  • 搜索
  • 消息

主要功能

  • 可自定义背景 (new)
  • 去页面推广、广告
  • 隐藏了视频顶部消息栏
  • 在视频播放界面播放器 全屏网页全屏 状态下,将鼠标放在右侧边缘可呼出播放器右侧面板
  • 隐藏了早已失效的lolivector插件UI
搬瓦工VPS优惠套餐,建站稳如狗,支持支付宝,循环出账94折优惠码BWH26FXH3HIQ
年付$28CN2线路,1核/512M内存/10G硬盘/500GB@1Gbps【点击购买】(经常售罄,请抓紧机会)
年付$47CN2线路,1核/1G内存/20G硬盘/1T@1Gbps【点击购买
我的文章对您有帮助吗?
我很可爱 请给我钱
扫一扫拿红包 → 扫商家收款码 → 花呗支付比红包多1分钱的金额
既可免费赞赏,又可完成支付宝支付任务!
Last modification:March 5th, 2019 at 06:38 pm
If you think my article is useful to you, please feel free to appreciate

Leave a Comment

389 comments

  1. seasmogchan  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 72.0.3626.121(Google Chrome 72.0.3626.121)

    chrome版本:72.0.3626.121(正式版本) (64 位)
    样式似乎会导致播放页面的标题无法选中复制

    1. 神代綺凜  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 72.0.3626.121(Google Chrome 72.0.3626.121)
      @seasmogchan

      感谢反馈,这是我的疏忽,已修复

  2. nanami  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 72.0.3626.121(Google Chrome 72.0.3626.121)

    怎么更新了有些地方还是和视频里有些差别

    1. 神代綺凜  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 72.0.3626.121(Google Chrome 72.0.3626.121)
      @nanami

      那是一年半前的视频了……后来b站改了很多,有些地方已经不做成和最初版本一样的效果了

  3. seasmogchan  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 74.0.3725.0(Google Chrome 74.0.3725.0)

    终于等来了新版样式的更新!ヾ(≧∇≦*)ゝ
    不过个人觉得播放器下方的功能按钮那个圆角有点过大了,跟其他的地方相比突兀了点

    1. 神代綺凜  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 72.0.3626.121(Google Chrome 72.0.3626.121)
      @seasmogchan

      因为那一条比较窄所以就想直接做成两边半圆了,那这么说还是统一一下圆角大小比较好?

      1. seasmogchan  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 74.0.3726.0(Google Chrome 74.0.3726.0)
        @神代綺凜

        你决定啊!我有得用就感激不尽啦φ( ̄∇ ̄o)

        1. 神代綺凜  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 72.0.3626.121(Google Chrome 72.0.3626.121)
  4. LelaGuerri  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 99.9.9999.999(Google Chrome 99.9.9999.999)

    像您网站这种乳白色的 半透明 遮罩就是一个很好的解决方法 图片背景能显示出来 文字还可以很好的识别

    https://i.imgur.com/bXegtBR.png 至于 请使用真实邮箱地址,否则一概不会通过审核
    同步通过审核无所谓只要大佬能看到就行真实邮箱是不可能用的

    1. 神代綺凜  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)
      @LelaGuerri

      莫,真实邮箱不是说要用“真实”邮箱,只是那种123@123.com的邮箱我会直接标为垃圾评论,你懂意思就好

  5. LelaGuerri  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 99.9.9999.999(Google Chrome 99.9.9999.999)

    您好大佬 可否在这个 B站主题的评论区位置增加一个 像 您网站 评论区这种乳白色半透明的遮罩图层呢
    因为 用了自定义壁纸 壁纸的颜色 一多 或者图案 太暗 或者太复杂 评论区的字就很难识别了
    我附上一张图.. 您看下... https://i.imgur.com/OMptVY9.jpg

    1. 神代綺凜  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)
      @LelaGuerri

      这是因为我还没写新版页面的样式

      1. LelaGuerri  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 99.9.9999.999(Google Chrome 99.9.9999.999)
        @神代綺凜

        嗯 嗯 能传达到 给大佬看到 就好-.-

  6. 子痕  Windows 10 x64 Edition(Windows 10 x64 Edition) / Sogou Explorer(Sogou Explorer)

    作为中年大叔,不太习惯年轻人又萌又这么多动画图片的网站。

  7. 教书先生  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 65.0.3325.181(Google Chrome 65.0.3325.181)

    我可以申请一下友链吗

    1. 神代綺凜  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)
      @教书先生

      因为目前友链太多所以不考虑再加,很抱歉

  8. 鸟叔  Windows 7 x64 Edition(Windows 7 x64 Edition) / Maxthon 5.2.5.4000(Maxthon 5.2.5.4000)

    网站主题真萌

    1. 神代綺凜  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)
      @鸟叔

      |´・ω・)ノ 谢谢夸奖

  9. cakeyui  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)

    稍后再看时也有标签栏
    直播和小黑屋跑到第二排去了∠( ᐛ 」∠)_(才发现)

    1. 神代綺凜  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)
      @cakeyui

      可我这里也是没有问题的啊……

      1. cakeyui  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)
        @神代綺凜

        ∠( ᐛ 」∠)_没法发图 我丢外链了 http://www.tzr.me/image/h8Iw9 就很奇怪。。。

        1. 神代綺凜  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)
          @cakeyui

          这就是没更新啊……或者 userstyle 出了什么 bug 你没更新到
          自行检查样式代码1这部分

          如果和图片中不一致就自行替换

          .bili-header-m > .bili-wrapper{
              width: 1285px;
          }
          @media screen and (max-width: 1400px){
          .bili-header-m > .bili-wrapper{
              width: 1055px;
          }
          }
          1. cakeyui  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)
            @神代綺凜

            感谢 因为首页修复了。。我以为代码更新到最全了 现在都能正常显示了

  10. OASIS  GNU/Linux x64(GNU/Linux x64) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)

    大佬..很喜欢您主页的样式 于是偷偷借用了下css 但是主页一行只能显示一篇文章,请问我缺少了什么修改?

    1. OASIS  GNU/Linux x64(GNU/Linux x64) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)
      @OASIS

      刚刚才仔细看了大佬的注释
      就不麻烦大佬啦~

  11. ss  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 63.0.3239.132(Google Chrome 63.0.3239.132)

    突然间Stylish被视为恶意脚本后 改用油猴子 版本的Stylish轻捷 然后发现评论区的留白 是尖角 不是圆角 老版界面的播放器边上白色 遮住了背景

    1. ss  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 63.0.3239.132(Google Chrome 63.0.3239.132)
      @ss

      不知 油猴子版的Stylish 会不会造成显示异常

      1. 神代綺凜  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)
        @ss

        用Stylus

        1. ss  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 63.0.3239.132(Google Chrome 63.0.3239.132)
          @神代綺凜

          试了一下 Stylus 和 Stylish的插件浏览器都安装不了显示恶意插件555

          1. 神代綺凜  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)
            @ss

            你要是 Chrome 的话从第三方网站直接下 crx 装扩展肯定装不了啊,都提示恶意
            https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne

  12. cakeyui  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)

    标签栏的直播和小黑屋跑到第二排去了。。能修改下吗

    1. 神代綺凜  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)
      @cakeyui

      已修复

      1. Stephanie  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 70.0.3538.102(Google Chrome 70.0.3538.102)
        @神代綺凜

        奇怪,明明已经是最新版,但是我还是存在这个问题耶。。

  13. AppleMiku  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)

    dalao厉害哇,bilibli好看多了

  14. seasmogchan  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)

    B站这两天就要把“数码”提为一级分区了。看来你的样式要稍微修改一哈了ヾ(≧∇≦*)ゝ

    1. 神代綺凜  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)
      @seasmogchan

      已改

      1. seasmogchan  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)
        @神代綺凜

        B站现在一级分区多了那么多个,上面导航栏一大排其实也不好看了╮(╯▽╰)╭

        1. 神代綺凜  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)
          @seasmogchan

          到时候推倒重写,做个收纳

          1. seasmogchan  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)
            @神代綺凜

            期待

  15. 梨子  GNU/Linux x64(GNU/Linux x64) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)

    喵~

    1. 神代綺凜  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)
      @梨子

      OωO

      1. 梨子  GNU/Linux x64(GNU/Linux x64) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)
        @神代綺凜

        主题好漂亮!

        1. 神代綺凜  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)
          @梨子

          |´・ω・)ノ谢谢夸奖

  16. 小芋头  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 69.0.3497.100(Google Chrome 69.0.3497.100)

    博主,你的博客主题是什么呀 好想要噢qwq

    1. 神代綺凜  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 71.0.3578.98(Google Chrome 71.0.3578.98)
      @小芋头

      Footer有

  17. 木名小威  Windows 10 x64 Edition(Windows 10 x64 Edition) / Opera 56.0.3051.116(Opera 56.0.3051.116)

    建议添加文本描边以及改色选项,不然壁纸颜色太深会看不清字(๑•̀ㅁ•́ฅ)

  18. ArrayCat  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 70.0.3538.110(Google Chrome 70.0.3538.110)

    看番的时候倒是没问题了,但是在看视频的时候就会出现标题栏下面没有留白造成标题文字看不清楚问题,咋搞呢

    1. ArrayCat  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 70.0.3538.110(Google Chrome 70.0.3538.110)
      @ArrayCat

      我试了下好像是因为B站新版播放器的问题??

      1. 神代綺凜  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 70.0.3538.102(Google Chrome 70.0.3538.102)
        @ArrayCat

        因为最近事情多还没有为新版播放器编写样式

        以后会完全重写

  19. uiiiiii  Windows 7 x64 Edition(Windows 7 x64 Edition) / Google Chrome 62.0.3202.94(Google Chrome 62.0.3202.94)

    背景好像刷不出来啦?

    1. 神代綺凜  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 70.0.3538.102(Google Chrome 70.0.3538.102)
      @uiiiiii

      coding pages 服务器不知道出什么问题了,目前暂时换回 github pages 了,应该正常了

      1. uiiiiii  Windows 7 x64 Edition(Windows 7 x64 Edition) / Google Chrome 62.0.3202.94(Google Chrome 62.0.3202.94)
        @神代綺凜

        感谢,可以了,就是图片刷出来需要等一点点时间

  20. 失足少女  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 68.0.3440.33(Google Chrome 68.0.3440.33)

    大佬啊,今天艹猫的背景莫得了

    1. 神代綺凜  Windows 10 x64 Edition(Windows 10 x64 Edition) / Google Chrome 70.0.3538.102(Google Chrome 70.0.3538.102)
      @失足少女

      coding pages 服务器不知道出什么问题了,目前暂时换回 github pages 了,应该正常了