No Youtube, há esse botão bacana (fácil de ignorar - canto superior esquerdo do vídeo) que permite "desligar as luzes": o fundo do site muda de branco para preto, a cor do texto muda de preto para cinza. Existe um plug-in não relacionado para o Firefox chamado "Turned Off The Lights", que tem uma funcionalidade muito semelhante.
Isso torna os sites muito mais fáceis de ler. No entanto, ambas as tecnologias funcionam apenas no YouTube. Existe alguma coisa para conseguir o mesmo efeito em todos os websites? De preferência com o Firefox?
Por exemplo: eu quero ter um fundo muito escuro e cores claras em todos os sites vistos com o Firefox, como posso fazer isso?
Este script de usuário inverte as cores dos sites selecionados. Para inverter cores em todos os sites, basta adicionar * à lista // @include . Acabei de testá-lo e funcionará bem para a maioria dos sites, mas os sites que dependem muito de imagens de plano de fundo podem não funcionar tão bem. O script pode ser configurado para excluir esses sites.
Se você não sabe o que são scripts de usuário, então você precisa de um primer .
A extensão Desativar as luzes (Chrome, Safari, Opera, IE) suporta todos os sites (vídeo ou não vídeo). Com um clique, torna a página escura e há uma opção para alterar a opacidade (para 100% ou menos)
Um bônus, eu li lá é uma opção para "Proteção para os olhos" que ele irá desligar automaticamente as luzes em um momento escolhido (por exemplo, quando é noite).
Se você precisar de um novo recurso, basta denunciá-lo na página do projeto de código.
Folhas de estilo do usuário .
CSS significa folhas de estilo em cascata. A "cascata" é a ordem em que são aplicadas.
Toda a apresentação na web (formas, cores, posicionamento, layout) deve ser tratada pelas folhas de estilo agora, embora alguns sites ainda possam usar o estilo HTML, é um grande não-bom para práticas recomendadas e obsoleto.
Na parte superior, há folhas de estilo externas, que podem ser vinculadas por qualquer página no servidor. A próxima lista é a folha de estilo incorporada (na parte superior acima do HTML no documento de página normalmente) e as folhas de estilos inline (para que você possa ter uma folha de estilo no site, anular certas coisas para uma página específica com estilos incorporados ou ter várias folhas de estilo externas HTML (os mais baixos (nas linhas inferiores) substituem os mais altos) e, em seguida, substituir certas coisas em um elemento com um estilo inline, talvez se você quiser fazer um parágrafo no site vermelho brilhante, negrito e flutuando sobre a atividade de rolagem. p>
Folhas de estilo do usuário como parte dos padrões de acessibilidade vêm por último e anulam tudo o mais, se você quiser que todo o seu texto seja tamanho 36 ou todos os planos de fundo sejam pretos e texto seja cinza, por exemplo.
Eu nunca fiz isso, mas acho que você acabou de adicionar CSS para planos de fundo e reiniciar o navegador.
body { background-color:#b0c4de; }
É uma tag CSS para a cor de fundo (preto é eiether ffffff ou 000000, eu esqueço). Uma folha de estilo externa não tem cabeçalhos, apenas tags.
exemplo 1 (qualtrics), exemplo 2 (w3schools)
Então, o seu pareceria algo como:
body p h1 h2 { background-color: 000000; }
p h1 h2 a { text-color: 818181; }