Existe uma maneira de ver exatamente qual declaraçãoestá afetando um elemento. Em vez de olhar para um milhão de propriedades no inspetor Firebug, onde dependendo de quantas classes algo é atribuído, pode conter muitas declarações com menor precedência e, portanto, não aplicadas. Pode demorar para descobrir qual declaração específica está de fato afetando seu elemento. Eu vejo longas declarações ignoradas como esta:
ul {
cor verde;
}
"Estilo computado" mostrará o resultado final de todas as hierarquias, mas não de onde o estilo deriva. Talvez eu esteja faltando algo simples. Muito obrigado!
Editar: Eu ouvi que deveria ser capaz de expandir os atributos na tag Computed, no entanto, não vejo onde essa opção está disponível. Eu posso ver que o tamanho da fonte é 13.333px, mas não há opção para ver de onde isso vem.
Respostas:
2 para resposta № 1Sim, no Firebug, selecione o elemento e clique emna aba "Computed" (ao visualizar o quadro HTML). Aqui você verá uma lista de propriedades CSS que podem ser expandidas para mostrar a localização do CSS relevante.
0 para resposta № 2
o Computado painel lateral pode te dar essa informação.
Note que apenas mostra o traço do CSS - por exemplo os estilos que estão afetando uma propriedade CSS específica - para essas propriedades, que são realmente alteradas pelas regras CSS de sua folha de estilo. Embora possa exibir todos os valores calculados para um elemento. Para ocultar os inalterados, você pode desmarcar a opção Mostrar CSS do agente do usuário.
Além disso, por favor, certifique-se de que você tem uma correnteversão do Firefox instalado (estável atual é 20.0.1). O Firebug usa internamente algumas APIs para o rastreamento de estilo, que estão disponíveis apenas nas versões mais recentes do Firefox.
0 para resposta № 3
No Chrome DevTools, há um painel "estilo computado" que mostra a lista de estilos para uma propriedade de elemento e seus locais. Por exemplo, veja a captura de tela para a propriedade de decoração de texto.
