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 fica?
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 fica?
Respostas:
(Atualização 2014) Como o suporte às folhas de estilo do usuário foi removido recentemente do Google Chrome, a única opção para esse momento é usar extensões (como a Stylus * 1), mas elas terão um comportamento diferente (veja abaixo).
A solicitação mais relevante para a reintrodução de folhas de estilo de usuário verdadeiras no Google Chrome é o Problema 347016: suporte a folhas de estilo de usuário .
Por especificação, a regra "folha de estilo do usuário verdadeira" possui uma especificidade de origem mais baixa em cascata do que a regra do autor, mas !important
as regras da folha de estilo do usuário têm uma especificidade de origem mais alta que a !important
regra do autor, independentemente da especificidade do seletor .
As extensões que imitam as folhas de estilo do usuário no Chrome simplesmente injetam (espero) o último elemento de estilo na página, o que tem algumas consequências:
!important
regra tenha uma especificidade maior do que aquela que você deseja substituir* 1 A extensão original, Stylish , está atualmente (2017) em estado de desenvolvimento irregular por um novo mantenedor, por isso aconselho a evitá-la e a usar alternativas como a Stylus mencionada acima.
(A resposta original a seguir agora está obsoleta.)
Depois, não é possível ajustar o css do UA em si, mas você pode criar um estilo de usuário global: inicie o Chrome uma vez --enable-user-stylesheet
. Isso criará o <user-data-dir>/<profile>/User StyleSheet/Custom.css
que você pode usar (as alterações são propagadas imediatamente).
http://code.google.com/p/chromium/issues/detail?id=2393
Custom.css
e User Stylesheets
não existe mais)
Você pode dar uma olhada nesta discussão: Edição 2393: Folha de estilo do usuário de suporte
No final, eles mencionam que o --enable-user-stylesheet
parâmetro ao iniciar o Chrome ativaria folhas de estilo personalizadas.
A única solução que posso pensar nisso é 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 ajudá-lo a começar:
COMO: Instalar scripts do Google Chrome Greasemonkey (somente Windows)
<style>
código do blockquote para o código para que você não precisa se preocupar com os "espaços extras"
Se você estiver interessado em personalizar sites específicos, poderá usar scripts de usuário no estilo greasemonkey .
Você pode alterar o estilo de crom ui crom. Lembre-se, se você o alterar, alguns efeitos como Exemplo: #footer {color:#5F5F5F !important;}
serão alterados em todos os sites que usam #footer. Você foi avisado. Custom.css muda quase tudo nos navegadores de cromos
Windows XP Google Chrome:
C: \ Documents and Settings \% USERNAME% \ Configurações locais \ Dados do aplicativo \ Google \ Chrome \ Dados do usuário \ Padrão
Crómio:
C: \ Documents and Settings \% USERNAME% \ Configurações locais \ Dados do aplicativo \ Chromium \ Dados do usuário \ Padrão \ Folhas de estilo do usuário
Windows 7 ou Vista (ajuda na seção de ajuda) Google Chrome:
C: \ Users \% USERNAME% \ AppData \ Local \ Google \ Chrome \ Dados do usuário \ Default \ User StyleSheets
Crómio:
C: \ Users \% USERNAME% \ AppData \ Local \ Chromium \ Dados do usuário \ Default \ User StyleSheets
Mac OS X Google Chrome:
~ / Biblioteca / Suporte a aplicativos / Google / Chrome / Padrão / User StyleSheets
Crómio:
~ / Biblioteca / Suporte a aplicativos / Chromium / Padrão / User StyleSheets
Linux Google Chrome:
~ / .config / google-chrome / Padrão / User StyleSheets
Crómio:
~ / .config / chromium / Padrão
Chrome OS
/ Página inicial / Chronos /
Quer uma prova, confira meu tema para o editor do programa http://userstyles.org/styles/95226/chrome-userstyles-editor-hacker-version-cyberat
Sinta-se à vontade para me consultar, crio folhas de estilo de interface do usuário ou sites aleatórios como o facebook google.etc e os deixo em preto e vermelho.
Há um problema ao usar o Stylish como injetor no estilo do
usuário!important
: o nível de prioridade do usuário sem é maior que o nível de prioridade do autor sem!important
Então, escrevo um script de usuário como injetor:
https://github.com/zcyzcy88/SelfColle/blob/master/StyleInject.user.js
princípio:
injetar estilo em document.head.prependChild()
, antes do estilo do autor da página da web, tem uma prioridade mais baixa, para evitar sobreposições no estilo do usuário.
document.head.prependChild()
, para evitar a sobreposição do estilo do usuário.
Em 2018, o Chrome> = 68.0.3440.106 (e provavelmente muito antes)
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 más opções de estilo no JIRA (e ocultar mais anúncios - heh heh). A opção que eu uso é "Injetar arquivo" e funciona muito bem. Eu não tentei regexar a configuração 'url' para fazê-la funcionar apenas em sites específicos, mas meus seletores de css são específicos o suficiente para que eu possa deixar a URL como '*'
Me deparei com essa pergunta ao procurar uma solução sobre como fornecer uma folha de estilo para páginas não estilizadas. Nenhuma das soluções acima me ajudou muito e ainda o Chrome de 09/2018 não suporta a função de folha de estilo personalizada removida anteriormente.
A solução que eu criei e que funciona como charme para o meu caso de uso é alcançada usando este complemento do chrome com um script js personalizado que insere meu css personalizado no cabeçalho da página, se ela não tiver folhas de estilo. Não funcionará em uma página que tenha qualquer folha de estilo vinculada, mas, para o 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);
});