更改Google Chrome的默认CSS


43

我希望能够更改chrome使用的默认CSS,例如删除链接的下划线等。但是,我找不到Chrome使用的默认CSS文件。有人知道它在哪里吗?


3
如果您是开发人员,建议不要执行此操作,因为它会更改css的默认值。
nXqd 2012年

对于简单的方式使用自己的非常简单的扩展看到修改CSS:stackoverflow.com/questions/21948850/...
用户

Answers:


33

(2014年更新)由于最近从Google Chrome浏览器中删除了对用户样式表的支持,因此目前唯一的选择是使用扩展名(如Stylus * 1),但是扩展名的行为会有所不同(请参见下文)。

在Google Chrome中重新引入真实用户样式表的最相关请求是问题347016:支持用户样式表

根据规范,“真正的用户样式表”规则在级联中比作者规则具有较低的原点特异性,但是无论其选择器特异性如何,!important用户样式表规则都比作者规则具有较高的原点特异性!important

在Chrome中模仿用户样式表的扩展程序只是(希望)将最后一个样式元素注入到页面中,这会产生一些后果:

  • 这种样式是级联中的“作者级别”,因此您必须确保您的!important规则具有比要覆盖的规则更高的特异性。
  • 页面脚本公开了“您的”注入样式,因此他们可以轻松地随意删除它。

* 1个原分机,时尚,目前(2017年)在不稳定的发展状态是一个用新mainetainer,所以我建议,以避免它和使用替代像上述的手写笔。


(以下原始答案现在已过时。)

Afaik无法调整UA css本身,但是您可以建立全局用户风格:使用一次启动Chrome --enable-user-stylesheet。这将创建<user-data-dir>/<profile>/User StyleSheet/Custom.css您可以使用的(更改将立即传播)。 http://code.google.com/p/chromium/issues/detail?id=2393


2
当前的Chromium似乎不合法。自从发布此答案以来,他们可能已经取消了此功能。
Pistos 2014年

1
您说得对,我已经更新了答案。
myf 2014年

是的,似乎不再受支持(在chrome 73和76(金丝雀)上尝试过)(Custom.css并且User Stylesheets不再存在)
localhostdotdev


4

我能想到的唯一解决方案是使用Greasemonkey脚本,该脚本向每个html页面添加样式项,从而关闭链接的下划线。就像是:

<style> a {text-decoration:none} </style>

本文显然可以帮助您入门:
如何:安装Google Chrome Greasemonkey脚本(仅Windows)


4
我觉得很有趣,因为我无法直接修改CSS。Firefox具有userChrome.css和userContent.css,这使外观的修改非常简单。
乔治四世

@harrymc-我将您的<style>代码从blockquote 切换到了代码,这样您就不必担心“多余的空格”了
Jared Harley 2009年


0

您可以更改Chrome CSS ui样式。请记住,如果您进行更改,#footer {color:#5F5F5F !important;}则在使用#footer的每个网站上,例如Example:的某些效果都会发生变化。你被警告了。Custom.css更改Chrome浏览器中的几乎所有内容

Windows XP Google Chrome:

C:\ Documents and Settings \%USERNAME%\ Local Settings \ Application Data \ Google \ Chrome \ User Data \ Default

铬:

C:\ Documents and Settings \%USERNAME%\ Local Settings \ Application Data \ Chromium \ User Data \ Default \ User StyleSheets

Windows 7或Vista(帮助部分中的帮助)Google Chrome:

C:\ Users \%USERNAME%\ AppData \ Local \ Google \ Chrome \ User Data \ Default \ User StyleSheets

铬:

C:\ Users \%USERNAME%\ AppData \ Local \ Chromium \ User Data \ Default \ User StyleSheets

Mac OS X Google Chrome:

〜/图书馆/应用程序支持/ Google / Chrome /默认/用户StyleSheets

铬:

〜/库/应用程序支持/ Chromium /默认/用户样式表

Linux Google Chrome:

〜/ .config / google-chrome /默认/用户样式表

铬:

〜/ .config /铬/默认

Chrome OS

/ home / chronos /

想要证明我的主题,请查看程序编辑器 http://userstyles.org/styles/95226/chrome-userstyles-editor-hacker-version-cyberat

随时检查我,我创建UI样式表或Facebook google.etc之类的随机网站,并将其设为黑色和红色。


4
那是行不通的,因为Chrome 33放弃了对用户样式的支持。
Synetech

0

时尚使用为用户样式的注入器时存在一个问题:不使用时的
用户优先级!important高于不使用时的作者优先级!important

所以我写了一个用户脚本作为注入器:https :
//github.com/zcyzcy88/SelfColle/blob/master/StyleInject.user.js

原则:在网页作者样式之前,在
处注入样式document.head.prependChild(),优先级较低,以避免用户样式覆盖。


您好,欢迎访问SuperUser.com。您是否能够更深入地了解脚本的确切功能?
服务经理

在注入样式document.head.prependChild(),以避免用户样式重叠。
Sista Fiolen's

如果您可以编辑答案,则可以更详细地了解脚本各部分的功能,这将很有帮助。
服务经理

0

在2018年,Chrome> = 68.0.3440.106(可能更早)

我已经有了用于各种开发用途的扩展名“ 资源覆盖 ”,因此现在使用它来添加自己的样式表,以修复JIRA中的一些不良样式选择(并隐藏更多广告-嘿嘿)。我使用的选项是“注入文件”,效果很好。我没有尝试过重新设置'url'设置以使其仅在特定网站上有效,但是我的CSS选择器足够具体,我可以将url保留为'*'


0

我在寻找有关如何为未样式化页面提供样式表的解决方案时遇到了这个问题。截至09/2018,上述解决方案均无法为我提供任何帮助.chrome不支持先前删除的自定义样式表功能。

我想到的解决方案与我的用例一样具有魅力,这是通过将此chrome插件与自定义js脚本结合使用而实现的,脚本将我的自定义css插入到页面标题(如果没有样式表)。它不能在链接了任何样式表的页面上工作,但是对于我的用例来说,这已经足够了。

这是我正在使用的JS脚本:

window.addEventListener("load", function(event) {
    console.log("All resources finished loading!");
    console.log(document.styleSheets); 
    if (document.styleSheets.length > 0) {
        return;
    }

    var css = `
    /*Your CSS goes here*/
    `;
    var style = document.createElement('style');
    style.type = 'text/css';
    style.appendChild(document.createTextNode(css));
    document.head.appendChild(style);
  });

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.