Como visualizar o CSS final computado, incluindo substituições, como configurações de alto contraste?

Question

Existe alguma ferramenta desse tipo? Por exemplo, quero ver todos os estilos aplicados à tag BODY. Eu sei que isso não o torna legível. No meu caso, existem várias opções que podem alterar dinamicamente o CSS através do navegador, ou o código-fonte (JSPs) ou devido a configurações do sistema como o modo de alto contraste etc., eu quero os estilos finais que foram usados para renderizar a página está sendo mostrado. Por favor sugira

EDITAR: Se eu tiver uma ferramenta, que também suporta o IE6, isso seria ótimo. Porque a página que estou visualizando será exibida com mais frequência do que qualquer outro navegador.

Obrigado & Saudações Prasanna Ram

    

Answer 1

Configurações de alto contraste fornecidas pelo sistema operacional têm nada relacionadas ao CSS. (Ou com navegadores para esse assunto, um navegador será totalmente inconsciente de tais configurações, e não irá alterar qualquer CSS para configurações de alto contraste do sistema.) Eu não acho que você vai encontrar qualquer ferramenta que "ajusta" o CSS para compensar configurações de alto contraste.

(Talvez existam ferramentas on-line, assim como o O Vischeck pode mostrar como as coisas são para alguém daltônico. Mas se uma ferramenta semelhante existe, eu realmente não tenho certeza de como isso ajudaria qualquer desenvolvedor que não precise de configurações de alto contraste, para determinar se alguém pode ver o site ... a ferramenta precisaria então "converter" alto contraste para aqueles com visão normal, para obter alguma idéia do que uma pessoa com deficiência visual experimentaria.

    

Answer 2

Você já tentou usar o Firebug ?

Firebug integrates with Firefox to put a wealth of web development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page.

    

Answer 3

Tente usar o Chrome - você pode selecionar qualquer parte de uma página, clicar com o botão direito e "Inspecionar elemento".

Isso mostra uma árvore de todo o código da página e você pode ver o CSS aplicado a qualquer elemento na árvore

    

Answer 4

Usando o Virtual PC [*] (também conhecido como "Modo Windows XP" no Windows 7) (ou outro solução de máquina virtual) é uma boa maneira de testar páginas da Web em uma ampla variedade de navegadores e configurações. A idéia é, desde que você não pode instalar o IE6 / 7/8 simultaneamente em um único PC, você pode instalá-los em diferentes máquinas virtuais para testes.

• Página inicial do Virtual PC (a versão mais recente é apenas para o Win-7)
• Virtual PC 2007 SP1 (para o Windows Server 2008, Vista SP1, XP SP3)

Microsoft fornece imagens VPC pré -configurado com o IE6 / 7/8 no XP ou Vista. São downloads grandes (cerca de 700 MB), mas fornecem uma imagem VPC completa pré-configurada com uma versão específica do IE, feita para testes de compatibilidade de aplicativos e sites. Eles são limitados no tempo e expiram 120 dias após o primeiro uso (para as imagens do Vista) ou em 1º de abril de 2010 (para as imagens do XP (supondo que não seja apenas uma piada de 1º de abril).

Uma vantagem para você: configurar um VPC para executar no modo de alto contraste e executá-lo lado-a-lado com outro VPC em execução no modo de não alto contraste (com a mesma versão do IE).

_{[*] Não é um endosso do produto Virtual PC. Você pode fazer o mesmo com VMware ou VirtualBox , ou seu produto de máquina virtual de escolha.}