Os novos recursos do desenvolvedor da web do Firefox, em combinação com incríveis complementos para desenvolvedores da Web, como o Firebug e a Barra de ferramentas para desenvolvedores da Web, tornam o Firefox um navegador ideal para desenvolvedores da Web. Todas as ferramentas estão disponíveis no Web Developer no menu do Firefox.
Inspetor de Páginas
Inspecione um elemento específico clicando com o botão direito e selecionando Inspecionar (ou pressionando Q). Você também pode iniciar o Inspetor no menu do Web Developer.
Se você quiser escolher um novo elemento, clique no Inspecionar botão na barra de ferramentas, passe o mouse sobre a página e clique em seu elemento. O Firefox destaca o elemento sob o cursor.
Inspetor de HTML
Clique no HTML botão para visualizar o código HTML do elemento atualmente selecionado.
O inspetor de HTML permite expandir e reduzir as tags HTML, facilitando a visualização em um piscar de olhos. Se você quiser ver o HTML da página em um arquivo simples, selecione Ver a origem da página no menu do Web Developer.
Inspetor de CSS
Clique no Estilo botão para ver as regras CSS aplicadas ao elemento selecionado.
Há também um painel de propriedades CSS - alterne entre os dois clicando no Regras e Propriedades botões. Para ajudá-lo a encontrar propriedades específicas, o painel de propriedades inclui uma caixa de pesquisa.
Você pode editar o CSS do elemento rapidamente no painel Regras. Desmarque qualquer uma das caixas de seleção para desativar uma regra, clique no texto para alterar uma regra ou adicione suas próprias regras ao elemento na parte superior do painel. Aqui, eu adicionei o intensidade da fonte: Negrito; Regra de CSS, tornando o texto do elemento em negrito.
Scratchpad JavaScript
O Scratchpad também viu uma atualização com o Firefox 10 e agora contém realce de sintaxe. Você pode digitar o código JavaScript para executar na página atual.
Depois de ter, clique no Executar menu e selecione Corre. O código é executado na guia atual.
Console da Web
O Console da Web substitui o antigo Console de Erros, que foi descontinuado e será removido em uma versão futura do Firefox.
O que é uma mensagem do desenvolvedor da web? É uma mensagem impressa no objeto window.console. Por exemplo, poderíamos executar o window.console.log (“Hello World”); Código JavaScript no Scratchpad para imprimir uma mensagem do desenvolvedor no console. Os desenvolvedores da Web podem integrar essas mensagens em seu código JavaScript para ajudar na depuração.
A partir do Firefox 10, o console da Web pode trabalhar em conjunto com o Page Inspector. A variável $ 0 representa o objeto atualmente selecionado no inspetor. Então, por exemplo, se você quisesse esconder o objeto atualmente selecionado, você poderia executar $ 0.style.display = "nenhum" no console.
Obtenha mais ferramentas
o Obtenha mais ferramentas opção leva você para a coleção de complementos do Web Developer Toolbox no site do Mozilla Add-Ons. Ele contém alguns dos melhores complementos para desenvolvedores da Web, incluindo o Firebug e a barra de ferramentas do desenvolvedor da Web.
Se você usa o Firefox há alguns anos, talvez se lembre do DOM Inspector. As ferramentas de desenvolvedor integradas do Firefox já percorreram um longo caminho desde então.
