Alterar o CSS padrão do Google Chrome

40

Eu gostaria de poder alterar o CSS padrão usado pelo chrome, como remover os sublinhados dos links etc. No entanto, não consigo encontrar o arquivo CSS padrão usado pelo Chrome. Alguém sabe onde é?

    
por George IV 08.10.2009 / 21:36

9 respostas

30

(Atualização de 2014) Como o suporte das folhas de estilo do usuário foi removido recentemente do Google Chrome, a única opção para esse momento é use extensões (como Stylus * 1), mas elas se comportarão de maneira diferente (veja abaixo).

A solicitação mais relevante para a reintrodução de folhas de estilo de usuário reais no Google Chrome é Edição 347016: Suporte folhas de estilo do usuário .

Por especificação, a regra "true user stylesheet" tem menor origem especificidade em cascata do que a regra de autor, mas !important user stylesheet rules tem maior especificidade de origem do que !important regra de autor, independentemente do seu seletor especificidade .

As extensões que imitam as folhas de estilos do usuário no Google Chrome simplesmente inserem (esperançosamente) o último elemento de estilo na página, o que tem algumas consequências:

  • esse estilo está em "nível de autor" na cascata, portanto, você deve garantir que sua regra !important tenha uma especificidade maior que a que você deseja substituir
  • "seu" estilo injetado é exposto a scripts de página, para que possam ser excluídos facilmente à vontade.

* 1 A extensão original, Stylish , está atualmente (2017) em estado de desenvolvimento errático por um novo mainetainer, então eu aconselharia a evitá-lo e usar alternativas como a Stylus acima mencionada.

(A resposta original é obsoleta).

Afaik não é possível ajustar o próprio CSS css, mas você pode fazer um estilo de usuário global: iniciar o Chrome uma vez com --enable-user-stylesheet . Isso criará <user-data-dir>/<profile>/User StyleSheet/Custom.css , que você pode usar (as alterações são propagadas imediatamente). link

    
por 21.09.2010 / 18:56
8

Você pode dar uma olhada nesta discussão: Problema 2393: Suporte a folha de estilo do usuário

No final, eles mencionam que o parâmetro --enable-user-stylesheet ao iniciar o Chrome ativaria folhas de estilo personalizadas.

    
por 16.03.2010 / 23:59
4

A única solução que posso pensar é usar um script Greasemonkey que adiciona uma entrada de estilo a cada página html que desativa os sublinhados dos links. Algo como:

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

Este artigo aparentemente pode começar: COMO: Instalar o Google Chrome Greasemonkey Scripts (somente Windows)

    
por 08.10.2009 / 21:53
2

Se você estiver interessado em personalizar determinados sites, use scripts de usuário do estilo greasemonkey .

    
por 29.10.2013 / 22:45
0

Você pode alterar o estilo do cromo css ui. Apenas lembre-se se você alterá-lo, alguns efeitos como Exemplo: #footer {color:#5F5F5F !important;} será alterado em todos os sites que usam #footer. Você foi avisado. O Custom.css altera quase tudo nos navegadores chromes

Windows XP Google Chrome:

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

Chromium:

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

Windows 7 ou Vista (ajuda na seção de ajuda) Google Chrome:

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

Chromium:

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

Mac OS X Google Chrome:

~/Library/Application Support/Google/Chrome/Default/User StyleSheets

Chromium:

~/Library/Application Support/Chromium/Default/User StyleSheets

Linux Google Chrome:

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

Chromium:

~/.config/chromium/Default

Chrome OS

/home/chronos/

Deseja verificar meu tema para o editor do programa? link

Sinta-se à vontade para me verificar, criar folhas de estilo da interface do usuário ou sites aleatórios, como o facebook google.etc, e torná-los pretos & vermelho.

    
por 19.11.2013 / 13:56
0

Há um problema quando usar Stylish como injetor de estilo de usuário: o nível de prioridade de usuário sem !important é maior que nível de prioridade de autor sem !important

Então eu escrevo um script de usuário como injetor: link

princípio:
O estilo de injeção em document.head.prependChild() , antes do estilo do autor da página da Web, tem prioridade mais baixa, para evitar a sobreposição no estilo do usuário.

    
por 04.03.2017 / 17:23
0

Em 2018, Chrome > = 68.0.3440.106 (e provavelmente muito mais cedo)

Eu já tinha a extensão Substituição de recursos para vários usos de desenvolvimento, então agora uso isso para adicionar minha própria folha de estilo para corrigir algumas opções de estilo ruins no JIRA (e para ocultar mais anúncios - heh heh). A opção que eu uso é "Inject File" e funciona muito bem. Eu não tentei regexar a configuração 'url' para fazer com que ela funcione apenas em sites específicos, mas meus seletores de css são específicos o suficiente para que eu possa deixar a URL como '*'

    
por 19.09.2018 / 19:14
0

Me deparei com essa pergunta ao procurar uma solução sobre como fornecer uma folha de estilo para páginas sem estilo. Nenhuma das soluções acima me ajudou muito e ainda a partir de 09/2018 o chrome não suporta a função de folha de estilo personalizada removida anteriormente.

A solução que surgiu e que funciona como charme para meu caso de uso é obtida usando este addon chrome com um script js personalizado que insere meu css personalizado no cabeçalho da página, se ele não tiver nenhuma folha de estilo. Ele não funcionará em uma página que tenha qualquer folha de estilo vinculada, mas, para meu caso de uso, é suficiente.

Aqui está o script JS que estou usando:

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);
  });
    
por 20.09.2018 / 20:41
-1
por 18.08.2015 / 02:57