web-dev-qa-db-fra.com

Changer le CSS par défaut de Google Chrome

J'aimerais pouvoir modifier le CSS par défaut utilisé par Chrome, par exemple en supprimant le soulignement des liens, etc. Cependant, je ne trouve pas le fichier CSS par défaut utilisé par Chrome. Quelqu'un sait-il où cela se trouve?

google-chromecss
41
George IV

(Mise à jour 2014) Le support des feuilles de style utilisateur ayant été récemment supprimé de Google Chrome, la seule option pour ce moment est d'utiliser des extensions (comme Stylus * 1), mais ils se comporteront différemment (voir ci-dessous).

La demande la plus pertinente pour réintroduire de vraies feuilles de style utilisateur dans Google Chrome est Problème 347016: Support des feuilles de style utilisateur .

Par spécification, la règle "true user stylesheet" a plus faible origine spécificité en cascade que la règle d'auteur , mais !important les règles de feuille de style utilisateur ont une spécificité d'origine supérieure à la règle d'auteur !important, quelle que soit sa spécificité (++) .

Les extensions imitant les feuilles de style utilisateur dans Chrome injectent simplement (espérons-le) le dernier élément de style dans la page, ce qui entraîne certaines conséquences:

  • ce style est à "niveau de l'auteur" dans la cascade, vous devez donc vous assurer que votre règle !important a une spécificité supérieure à celle que vous souhaitez remplacer.
  • "votre" style injecté est exposé aux scripts de page afin qu'ils puissent facilement le supprimer à volonté.

* 1 L'extension originale, élégante , est actuellement (2017) en état de développement irrégulier par un nouveau mainetainer, je vous conseille donc de l'éviter et de l'utiliser alternative comme Stylus susmentionné.

(Suite à la réponse originale est maintenant obsolète.)

Cependant, il n’est pas possible de modifier le fichier UA css lui-même, mais vous pouvez créer un style d’utilisateur global: démarrez Chrome une fois avec --enable-user-stylesheet. Ceci créera <user-data-dir>/<profile>/User StyleSheet/Custom.css que vous pourrez utiliser (les modifications sont propagées immédiatement). http://code.google.com/p/chromium/issues/detail?id=2393

31
myf

Vous pouvez consulter cette discussion: Problème 2393: feuille de style utilisateur du support technique

À la fin, ils mentionnent que le paramètre --enable-user-stylesheet lors du démarrage de Chrome activerait les feuilles de style personnalisées.

8
Gabriele Petrioli

La seule solution à laquelle je puisse penser consiste à utiliser un script Greasemonkey qui ajoute une entrée de style à chaque page html, ce qui désactive le soulignement des liens. Quelque chose comme:

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

Cet article peut apparemment vous aider à démarrer:
COMMENT FAIRE: Installer les scripts Greasemonkey de Google Chrome (Windows uniquement)

4
harrymc

Si vous souhaitez personnaliser des sites Web particuliers, vous pouvez utiliser des scripts utilisateur de style greasemonkey .

2
Kevin Panko

En 2018, Chrome> = 68.0.3440.106 (et probablement beaucoup plus tôt)

J'avais déjà l'extension Override pour diverses utilisations du développement. Je l'utilise donc maintenant pour ajouter ma propre feuille de style afin de corriger certains mauvais choix de style dans JIRA (et pour cacher plus d'annonces - heh heh). L'option que j'utilise est "Inject File" et cela fonctionne très bien. Je n'ai pas essayé de définir le paramètre 'url' pour qu'il ne fonctionne que sur des sites particuliers, mais mes sélecteurs CSS sont suffisamment spécifiques pour que je puisse laisser l'URL sous la forme '*'.

0
eon

Je suis tombé sur cette question lorsque je cherchais une solution sur la manière de fournir une feuille de style pour des pages non stylées. Aucune des solutions ci-dessus ne m’a beaucoup aidé à partir de 09/2018, chrome ne prend pas en charge la fonction de feuille de style personnalisée précédemment supprimée.

La solution que j'ai proposée et qui fonctionne comme un charme pour mon cas d'utilisation est obtenue en utilisant cet addon chrome avec un script js personnalisé qui insère mon css personnalisé. à l'en-tête de la page s'il n'y a pas de feuilles de style. Cela ne fonctionnera pas sur une page ayant une feuille de style liée, mais dans mon cas d'utilisation, cela suffit.

Voici le script JS que j'utilise:

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);
  });
0
Maroš Beťko

Il y a un problème lorsque vous utilisez Stylish en tant qu'injecteur de style utilisateur:
le niveau de priorité de l'utilisateur sans !importantest supérieur à le niveau de priorité de l'auteur sans !important

J'écris donc un script utilisateur en tant qu'injecteur:
https://github.com/zcyzcy88/SelfColle/blob/master/StyleInject.user.js

principe:
Le style de la fonction document.head.prependChild(), avant le style de l'auteur de la page Web, a une priorité inférieure pour éviter la superposition par le style de l'utilisateur.

0
Sista Fiolen

Vous pouvez changer le style chromes css ui. Rappelez-vous que si vous le modifiez, certains effets tels que Exemple: #footer {color:#5F5F5F !important;} changeront sur chaque site utilisant #footer. Vous avez été prévenu. Custom.css change presque tout dans les navigateurs chromes

Windows XP Google Chrome:

C:\Documents and Settings \% USERNAME%\Paramètres locaux\Données d'application\Google\Chrome\Données utilisateur\Par défaut

Chrome:

C:\Documents and Settings \% USERNAME%\Paramètres locaux\Données d'application\Chromium\Données utilisateur\Par défaut\Feuilles de styles utilisateur

Windows 7 ou Vista (aide dans la section d'aide) Google Chrome:

C:\Utilisateurs \% NOMUTILISATEUR%\AppData\Local\Google\Chrome\Données utilisateur\Par défaut\Feuilles de style utilisateur

Chrome:

C:\Utilisateurs \% USERNAME%\AppData\Local\Chromium\Données utilisateur\Par défaut\Feuilles de style utilisateur

Mac OS X Google Chrome:

~/Bibliothèque/Application Support/Google/Chrome/Par défaut/StyleSheets de l'utilisateur

Chrome:

~/Bibliothèque/Application Support/Chromium/Default/StyleSheets de l'utilisateur

Linux Google Chrome:

~/.config/google-chrome/Default/User StyleSheets

Chrome:

~/.config/chrome/Défaut

Chrome OS

/ home/chronos /

Vous voulez vérifier mon thème pour l'éditeur de programme http://userstyles.org/styles/95226/chrome-userstyles-editor-hacker-version-cyberat

N'hésitez pas à me consulter, je crée des feuilles de style d'interface utilisateur ou des sites aléatoires tels que facebook google.etc, et les rend noir et rouge.

0
cyberationmicro.com