☰

Grasemonkey - 更改设计（CSS）

tag-icon • tag-icon firefox javascript css
Grasemonkey - 更改设计（CSS）

我需要你的帮助。我想用 Grasemonkey 更改设计（CSS 代码）。仅更改颜色。

此页面颜色较浅，我想将浅色改为深色。我该怎么做？www.cp.roleplay-gaming.net

答案1

我不太熟悉 Greasemonkey，但看起来您可以添加用户脚本来覆盖一些基本 CSS。

例如，下面的代码会将您上面分享的网站登录页面的背景颜色更改为深色。问题是什么？它仅适用于 Greasemonkey 版本 < 4。

// ==UserScript==
// @name     _Override default styles, turn light to dark
// @include /https?\:\/\/([a-z\.]*\.)?cp.roleplay-gaming\.net\/.*/
// @grant    GM_addStyle
// ==/UserScript==

GM_addStyle ( `
    body {
        background-color: #222;
    }
    .loginColumns .row div:nth-child(2){
        color: white;
    }
    /* add other CSS here */
` );

但是对于 Greasemonkey > 版本 4，这个功能似乎已经失效。因此，您必须使用一些 javascript，如下所示：

// ==UserScript==
// @name     _Override default styles, turn light to dark
// @include /https?\:\/\/([a-z\.]*\.)?cp.roleplay-gaming\.net\/.*/
// ==/UserScript==

function GM_addStyle(cssStr){

    var n = document.createElement('style');
    n.type = "text/css";
    n.innerHTML = cssStr;
    document.getElementsByTagName('head')[0].appendChild(n);

}

GM_addStyle("
    body {
        background-color: #222;
    }
    .loginColumns .row div:nth-child(2){
        color: white;
    }
");

无论采用哪种方法，添加所需的样式，然后将此文件另存为darker.user.js。接下来，按照以下说明操作https://wiki.greasespot.net/Greasemonkey_Manual:Installing_Scripts安装。尽情享用吧！

相关内容