☰

更新：

tag-icon • tag-icon chrome browser
更新：

是否可以更改 Chromium 浏览器中滚动条的颜色，而无需安装其他扩展程序？

也许通过修改某个地方的 css 文件？

我在 Debian 10 上使用 chromium 83。

我知道如何在 Firefox 中实现这一点。我刚刚添加了以下几行userContent.css

html,body{
    scrollbar-color: #B63C29 #555555 !important;
}

我可以做类似的事情来实现 Chromium 的相同效果吗？

更新：

我尝试过以下解决方案，但没有效果：

  1. 我已经创建了目录~/.config/chromium/Default/User StyleSheets/
  2. Custom.css在其中创建文件
  3. 添加以下代码来测试它：
    .scrollable-element {
      scrollbar-color: red yellow;
    }

没有什么。没有效果。

有人可以告诉我简单的吗在职的例如如何将滚动条更改为红色？

答案1

如果没有其他办法，你可能最终需要使用某种扩展。基于这个问题和这个答案和这个我这样做了：

$ mkdir CustomCSS && cd CustomCSS
$ cat > manifest.json << EOF
 
{
    "name": "My Style Sheet",
    "content_scripts": [
        {
          "matches": ["*://*/*"],
          "css": ["Custom.css"]
        }
    ],
    "version": "1.0.0",
    "description": "User StyleSheet replacement",
    "manifest_version": 2
}
EOF

$ cat > Custom.css << EOF
 
::-webkit-scrollbar {
    height: 12px;
    width: 12px;
    background: yellow;
}
 
::-webkit-scrollbar-thumb {
    background: red;
    -webkit-border-radius: 1ex;
    -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.75);
}
 
::-webkit-scrollbar-corner {
    background: #000;
}
EOF

在chrome://extensions开发者模式打开时：加载解压的扩展 -> 选择 path/to/CustomCSS

就是这样。有用。黄色背景上的红色滚动条。

检查 chrome://memory显示它使用了约 1.8MiB 的内存。

--

Ed：如果你想覆盖网站的样式，你可以尝试使用!important规则

background: red !important;

答案2

对的，这是可能的。

!ddg 铬滚动条颜色

如何更改 Google Chrome 中的滚动条以具有不同的颜色？

如何更改 Chrome 中的滚动条样式和颜色

在 Google Chrome (-webkit) 中使用 css 设置滚动条样式

还有一个发现了上面的链接：

谷歌浏览器或铬

Google Chrome 提供了一个用户样式表，您可以在配置文件夹或用户配置文件文件夹中修改该样式表。在 Chromium/Linux 中，它位于 ~/.config/chromium/Default/User StyleSheets/Custom.css。对于 Google Chrome，它位于 ~/.config/google-chrome/Default/User StyleSheets/。在 MS Windows 中，该位置为 %AppData%\Local\Google\Chrome\User Data\Default\User StyleSheets。根据浏览器版本和操作系统的不同，这可能会有所不同，但请检查系统上文件夹 /Default/User StyleSheets/ 下的配置文件夹。另外，如果没有名为 Custom.css 的文件，那么您需要在 User StyleSheets/ 文件夹中创建一个文件。

如何在 Web 浏览器中使用自定义或用户样式表 (css)。

相关内容