• Sobre nós
  • Anunciar
  • política de Privacidade
  • Contate-nos
Notícias MasterTrend
  • Lar
    • BLOG
    • SERVIÇO TÉCNICO
    • LOJA
  • Tutoriais
  • Hardware
  • jogos
  • Celulares
  • Segurança
  • Windows
  • IA
  • Programas
  • Redes
  • Notícias
  • pt_BRPortuguese
    • es_ESSpanish
    • en_USEnglish
    • fr_FRFrench
    • it_ITItalian
    • de_DEGerman
    • ko_KRKorean
    • jaJapanese
    • zh_CNChinese
    • ru_RURussian
    • thThai
    • pl_PLPolish
    • tr_TRTurkish
    • id_IDIndonesian
    • hi_INHindi
    • arArabic
    • sv_SESwedish
    • nl_NLDutch
Nenhum resultado
Ver todos os resultados
  • Lar
    • BLOG
    • SERVIÇO TÉCNICO
    • LOJA
  • Tutoriais
  • Hardware
  • jogos
  • Celulares
  • Segurança
  • Windows
  • IA
  • Programas
  • Redes
  • Notícias
  • pt_BRPortuguese
    • es_ESSpanish
    • en_USEnglish
    • fr_FRFrench
    • it_ITItalian
    • de_DEGerman
    • ko_KRKorean
    • jaJapanese
    • zh_CNChinese
    • ru_RURussian
    • thThai
    • pl_PLPolish
    • tr_TRTurkish
    • id_IDIndonesian
    • hi_INHindi
    • arArabic
    • sv_SESwedish
    • nl_NLDutch
Nenhum resultado
Ver todos os resultados
Notícias MasterTrend
Nenhum resultado
Ver todos os resultados
Começar Tutoriais

Truques do Element Inspector: transforme seu site agora! ⚡️

Insights da MasterTrend por Insights da MasterTrend
2 de abril de 2025
em Tutoriais
Tempo de leitura:Leitura de 9 minutos
PARA PARA
0
Truques do Element Inspector - 8 dicas essenciais!
6
COMPARTILHADO
18
Visualizações
Compartilhe no FacebookCompartilhe no Twitter

Conteúdo

  1. Truques do Element Inspector: 8 dicas essenciais! 🛠️
  2. 1 . Baixar Imagens
    1. Passo 1
    2. Passo 2
    3. Passo 3
  3. 2 . Baixar vídeos
    1. Passo 1
    2. Passo 2
    3. Passo 3
  4. 3 . Capturar telas de tela de página inteira
  5. 4 . Finja que você está no telefone
  6. 5 . Identificar fontes
  7. 6 . Editar texto em uma página (temporariamente)
  8. 7 . Excluir itens
  9. 8 . Identificar valores de cores
    1. Publicações Relacionadas

Truques do Element Inspector: 8 dicas essenciais! 🛠️

O Inspetor de Elementos no seu navegador pode parecer uma ferramenta exclusiva para desenvolvedores, mas você pode fazer coisas bem legais com ele, mesmo que não saiba nada sobre programação! 🚀

1 . Baixar Imagens

Talvez seja necessário baixar uma imagem de um site. Você tenta clicar com o botão direito e clicar em “Salvar imagem”, mas descobre que a opção está esmaecida ou o botão “Salvar imagem” não aparece. Outras vezes, você só consegue baixar uma miniatura da imagem, não o arquivo inteiro. 🤔 E aí?

Os desenvolvedores geralmente desabilitam esse botão “Salvar imagem” intencionalmente ou usam uma estrutura da web que não permite que imagens sejam baixadas dessa forma. Mas há uma solução útil no Inspetor de Elementos. Você pode obter qualquer recurso de imagem de um site, em tamanho real, em três etapas simples. 📸

Às vezes essas imagens são bloqueado por razões de licenciamento e direitos autorais, então tenha cuidado com isso e atenha-se ao uso justo para evitar problemas legais. ⚖️

Passo 1

Faz clique com o botão direito em em qualquer lugar da página e selecione “Inspecionar Elemento” ou “Inspecionar”. Você também pode usar o atalho de teclado específico para o inspetor no seu navegador. F12 funciona na maioria dos navegadores e sistemas operacionais. Estou usando o Firefox para esta demonstração, mas os passos são idênticos. 🖱️

Passo 2

Na janela do Inspetor de Elementos, clique na aba “Rede”. A aba de rede deve ter “Imagens” como um de seus submenus. Clique em “Imagens”. 🖼️

Agora recarregue a página para que todos os recursos de imagem apareçam na aba “Imagens”. Use o Botão Atualizar ao lado da barra de endereço do seu navegador ou pressione Ctrl+R. 🔄

Salvando uma imagem usando Inspecionar Elemento.

Passo 3

E aí está. A biblioteca de imagens inteira deve ser carregada na lista. A lista é atualizada dinamicamente, então, à medida que mais imagens são carregadas no site, elas também aparecerão aqui. 🖼️✨

Você pode passar o mouse sobre um arquivo para ver sua pré-visualização e dimensões. Clique duas vezes para abrir o arquivo em uma nova aba, onde você pode salvá-lo usando o menu do botão direito. 💾

Salvando um arquivo de imagem usando o Inspetor de Elementos.

2 . Baixar vídeos

Assim como os ativos de imagem, às vezes os sites não permitem descarga vídeos diretamente. Mas você pode baixá-los carregando-os no inspetor de elementos. Depois de carregados no inspetor, basta clicar duas vezes no nome do arquivo para abri-lo em uma nova guia. 🎥

Passo 1

Abra a janela Inspetor de Elementos pressionando o atalho de teclado F12 (deve funcionar na maioria dos sistemas). Como alternativa, você pode clicar com o botão direito em qualquer lugar da página da web e selecionar “Inspecionar”. A janela Inspetor de Elementos deve aparecer. 🖱️

Passo 2

Clique na aba “Rede” e depois em “Mídia” para filtrar tudo, exceto arquivos de vídeo. Recarregue a página. Clicando no botão de atualização do navegador ou pressionando Ctrl+R. 🔄

Carregando arquivos de mídia usando o Inspetor de Elementos no Firefox.

Passo 3

Os arquivos de vídeo devem ser carregados em uma lista. Você não pode fazer uma visualização instantânea, mas pode clicar duas vezes em um arquivo para abri-lo em uma nova guia. Lá, você pode clicar com o botão direito e fazer o download. 🎬

Salvando um arquivo de vídeo usando inspecionar elemento.

3 . Capturar telas de tela de página inteira

Se você quiser salvar uma página da web inteira, você pode baixá-la rapidamente como um arquivo PDF ou HTML. Mas e se você quiser fazer uma captura de tela normal da página inteira? Aqui Vou explicar como fazer isso. 📸

O Firefox tem uma ferramenta de captura de tela dedicada no menu de contexto, então vou mostrar como fazer isso em Google Chrome e outros navegadores. 🌐

Abra a ferramenta Inspetor clicando com o botão direito em qualquer lugar da página ou pressionando F12.

Fazendo uma captura de tela de página inteira usando o elemento inspecionar no Chrome.

Pressione Ctrl+Shift+P para abrir a janela Executar. escrevi Capturar captura de tela grande nesta janela. Clique nele. 📄

Uma janela “Salvar como” deve aparecer instantaneamente, permitindo que você salve a captura de tela da página inteira no formato JPG. 💾

Salvando uma captura de tela de página inteira usando o elemento inspecionar no Chrome.

4 . Finja que você está no telefone

A maioria dos sites carrega de forma diferente dependendo do tipo de dispositivo e do tamanho da tela. Se você quiser enganar o site e fazê-lo pensar que você está usando um dispositivo diferente (por qualquer motivo), você pode fazer isso facilmente com a ferramenta de inspeção. 📱

No Chrome, abra a janela Inspetor de Elementos no menu do botão direito ou com F12. Em seguida, clique no pequeno ícone de laptop e telefone no canto superior esquerdo. O Firefox tem um botão semelhante, chamado Modo de Design Responsivo (Ctrl+Shift+M). 🖥️

Alterando o agente de usuário padrão no Chrome.

Você terá uma lista de dispositivos que pode emular e também poderá ajustar manualmente o tamanho dos tela. Depois de escolher um dispositivo móvel, você notará que seu navegador também simula gestos de toque. 📱✨

5 . Identificar fontes

Esta dica é para criativos, mas qualquer pessoa curiosa sobre fontes em um site pode usar esse truque. Você pode usar o ferramenta de inspeção para identificar e às vezes até baixar fontes. 🖋️

Primeiro, abra a ferramenta Inspetor de Elementos. Em seguida, clique na aba “Rede” (ela pode estar oculta no menu de estouro) e selecione “Fonte”.

Identificando e baixando fontes usando o Inspect Element.

Em seguida, pressione Ctrl+R. As fontes renderizadas serão carregadas na lista, provavelmente no formato WOFF. Você pode baixá-los diretamente clicando duas vezes no nome da fonte. Por exemplo, o How-To Geek usa Roboto como fonte padrão. 🔤

Se precisar de informações mais detalhadas sobre a fonte, vá até a aba “Elementos” e selecione “Estilos”. Role para baixo até a propriedade da família de fontes e clique nela. O texto correspondente será iluminado no site. Dessa forma, você pode identificar uma fonte com precisão. 🎨

Informações detalhadas sobre a fonte no código-fonte da página.

6 . Editar texto em uma página (temporariamente)

Você sabia que pode editar temporariamente quase tudo em uma página da web usando o inspetor? Esta ferramenta permite que você edite o código que compõe o site, então se você souber algum código, você pode fazer a página ter a aparência que quiser (somente na sua máquina, até você recarregar a página). 🛠️

Mesmo que você não saiba nada de codificação, você pode editar texto básico em qualquer página da web. Pode ser uma brincadeira engraçada para pregar nos seus amigos. 😉

Destaque o texto na página que você deseja editar e clique com o botão direito nele. Em seguida, selecione “Inspecionar” ou “Inspecionar elemento”.

O trecho de texto relevante deve aparecer na aba Elementos. Basta clicar duas vezes e substituir o texto pelo que quiser. ✏️

Feche o Inspetor de Elementos e pronto! Observe que se você recarregar a página, suas alterações serão desfeitas. 🔄

7 . Excluir itens

Assim como na edição de texto, você também pode excluir elementos específicos de uma página da web. Novamente, as alterações durarão apenas até você recarregar a página. ❌

Clique com o botão direito do mouse no item que deseja excluir e selecione “Inspecionar” ou “Inspecionar elemento”.

Passe o mouse sobre os rótulos “

” até que todo o elemento seja destacado. Então basta pressionar a tecla Delete. 🔚

Removendo um elemento da página web usando Inspecionar Elemento.

E assim, de repente, ele se foi! 🕵️‍♂️

8 . Identificar valores de cores

Outra dica para criativos: você pode obter valores RGB e HEX de qualquer cor em uma página da web com a ferramenta conta-gotas que você encontrará no inspetor de elementos. 🎨

Clique com o botão direito em qualquer lugar da página e abra o Inspetor. Por padrão, a janela Regras é aberta na guia Inspetor. Role para baixo para encontrar quaisquer propriedades rotuladas como cor.

A propriedade de cor deve ter um círculo ou quadrado colorido ao lado dela. Clique nele para abrir o seletor de cores e pressione o ícone do conta-gotas ao lado dele. 🖌️

Usando a ferramenta conta-gotas em Inspecionar elemento.

Você pode arrastar este conta-gotas para qualquer lugar na página para encontrar valores de cor. Clicar no conta-gotas preencherá automaticamente a propriedade com o valor de cor que você acabou de selecionar. Você pode copiá-lo facilmente daqui. 📋

Usando o conta-gotas via Inspecionar Elemento.

Esses dicas mal arranham a superfície do que é realmente possível usando o Inspetor de Elementos. Se você quiser se aprofundar no desenvolvimento web, aqui está um guia para você começar. 💻

Compartilhe isto:
1FacebookLinkedInPinterestXRedditTumblrCéu AzulTópicosCompartilhar
1
COMPARTILHAR

Publicações Relacionadas

  • Conserto de computador
  • Instale o Windows 11 Home sem Internet
  • Microsoft Copilot – recomendações para usar IA no Windows
  • Série Intel Alder Lake S sem chaves K
  • Pesquisa de download de arquivo WP
  • Troca de disco rígido – Substitua HDD por notebook SSD
  • Remoção de vírus
  • As melhores ferramentas de diagnóstico para Windows 10/11
Etiquetas: Dicas do navegadorConteúdo EvergreenDicas técnicas
Postagem anterior

Remover aplicativos desconhecidos no Windows 11: descubra 8 segredos! 🔍

Próxima publicação

Como melhorar o desempenho do seu Nintendo Switch 🎮💨

Insights da MasterTrend

Insights da MasterTrend

Nossa equipe editorial compartilha análises detalhadas, tutoriais e recomendações para ajudar você a aproveitar ao máximo seus dispositivos e ferramentas digitais.

Próxima publicação
Como melhorar o desempenho do seu Nintendo Switch

Como melhorar o desempenho do seu Nintendo Switch 🎮💨

5 2 votos
Classificação do artigo
Inscrever-se
Acesso
Notificar de
convidado
convidado
0 Comentários
mais antigo
Mais recente Mais votados
Comentários on-line
Ver todos os comentários

Fique conectado

  • 976 Fãs
  • 118 Seguidores
  • 1,4 mil Seguidores
  • 1,8 mil Assinantes

Não perca as últimas novidades em tecnologia e jogos.
Dicas exclusivas, guias práticos e análises todos os dias.

Formulário de inscrição
  • Tendências
  • Comentários
  • Durar
12 melhores alternativas ao Lucky Patcher para Android

Alternativas ao Lucky Patcher: 12 aplicativos melhores e fáceis! 🎮⚡

12 de maio de 2025
Como adicionar um relógio à área de trabalho do Windows 11: 3 truques infalíveis!

Como adicionar um relógio à área de trabalho do Windows 11: faça mais em minutos! ⏱️

1 de maio de 2025
Como usar o AdGuard DNS no Android em 2024

Como usar o AdGuard DNS no Android em 2025

11 de fevereiro de 2025
Como forçar o modo apenas 4G LTE no Android

Como forçar o modo apenas 4G LTE no Android em 2025

10 de fevereiro de 2025
Recursos do Gmail no Android: economize tempo com 5 dicas

Recursos do Gmail no Android: 5 truques que você não conhecia! 📱✨

12
Conserto de placa-mãe - Reparar placas-mãe

Conserto de placa mãe de notebook

10
Instale o Windows 11 Home sem Internet

Instale o Windows 11 Home sem Internet

10
Como fazer backup de drivers no Windows 11/10 em 4 etapas!

Como fazer backup de drivers no Windows 11/10: evite erros! 🚨💾

10
Assassin's Creed Shadows elimina o carrasco - Texto alternativo: "Captura de tela de Assassin's Creed Shadows mostrando um intenso duelo noturno entre o protagonista e o carrasco blindado Shindo Hiroshii em uma vila tradicional japonesa mal iluminada, com fogo e moradores ao fundo."

Assassin's Creed Shadows elimina o Carrasco: Descubra como!

27 de julho de 2025
Ubuntu vs Kubuntu - Texto alternativo: Comparação dos logotipos dos sistemas operacionais Linux Ubuntu e Kubuntu, com o logotipo laranja do Ubuntu à esquerda e o logotipo azul do Kubuntu à direita, separados por um símbolo "vs" prateado em um fundo de pedra texturizado.

Ubuntu vs. Kubuntu: Qual é melhor para você? Vou te contar agora! 🚀💻

27 de julho de 2025
Gerenciador de janelas da área de trabalho - Texto alternativo otimizado para SEO: Mulher usando fones de ouvido trabalhando em um computador com uma tela exibindo a pergunta "O que é o Gerenciador de janelas da área de trabalho (dwin eve) e o que ele faz?" em um ambiente de escritório doméstico moderno.

Gerenciador de janelas da área de trabalho: 4 truques para reduzir a RAM e acelerar o Windows 🚀✨

27 de julho de 2025
Como verificar se um arquivo é seguro - Mulher usando um laptop com uma tela exibindo a mensagem de segurança "O arquivo é seguro" com um ícone de escudo verde e uma marca de seleção, representando como verificar se um arquivo é seguro em um ambiente de computação moderno com o logotipo do Windows ao fundo.

Como verificar se um arquivo é seguro antes de abri-lo — sem antivírus! 🛡️🚫

26 de julho de 2025

Notícias recentes

Assassin's Creed Shadows elimina o carrasco - Texto alternativo: "Captura de tela de Assassin's Creed Shadows mostrando um intenso duelo noturno entre o protagonista e o carrasco blindado Shindo Hiroshii em uma vila tradicional japonesa mal iluminada, com fogo e moradores ao fundo."

Assassin's Creed Shadows elimina o Carrasco: Descubra como!

27 de julho de 2025
0
Ubuntu vs Kubuntu - Texto alternativo: Comparação dos logotipos dos sistemas operacionais Linux Ubuntu e Kubuntu, com o logotipo laranja do Ubuntu à esquerda e o logotipo azul do Kubuntu à direita, separados por um símbolo "vs" prateado em um fundo de pedra texturizado.

Ubuntu vs. Kubuntu: Qual é melhor para você? Vou te contar agora! 🚀💻

27 de julho de 2025
10
Gerenciador de janelas da área de trabalho - Texto alternativo otimizado para SEO: Mulher usando fones de ouvido trabalhando em um computador com uma tela exibindo a pergunta "O que é o Gerenciador de janelas da área de trabalho (dwin eve) e o que ele faz?" em um ambiente de escritório doméstico moderno.

Gerenciador de janelas da área de trabalho: 4 truques para reduzir a RAM e acelerar o Windows 🚀✨

27 de julho de 2025
6
Como verificar se um arquivo é seguro - Mulher usando um laptop com uma tela exibindo a mensagem de segurança "O arquivo é seguro" com um ícone de escudo verde e uma marca de seleção, representando como verificar se um arquivo é seguro em um ambiente de computação moderno com o logotipo do Windows ao fundo.

Como verificar se um arquivo é seguro antes de abri-lo — sem antivírus! 🛡️🚫

26 de julho de 2025
6
Logotipo da MasterTrend News

MasterTrend Info é a sua fonte de referência em tecnologia: descubra notícias, tutoriais e análises sobre hardware, software, jogos, dispositivos móveis e inteligência artificial. Assine nossa newsletter e não perca nenhuma tendência.

Siga-nos

Navegar por categoria

  • jogos
  • Hardware
  • IA
  • Celulares
  • Notícias
  • Redes
  • Segurança
  • Programas
  • Tutoriais
  • Windows

Notícias recentes

Assassin's Creed Shadows elimina o carrasco - Texto alternativo: "Captura de tela de Assassin's Creed Shadows mostrando um intenso duelo noturno entre o protagonista e o carrasco blindado Shindo Hiroshii em uma vila tradicional japonesa mal iluminada, com fogo e moradores ao fundo."

Assassin's Creed Shadows elimina o Carrasco: Descubra como!

27 de julho de 2025
Ubuntu vs Kubuntu - Texto alternativo: Comparação dos logotipos dos sistemas operacionais Linux Ubuntu e Kubuntu, com o logotipo laranja do Ubuntu à esquerda e o logotipo azul do Kubuntu à direita, separados por um símbolo "vs" prateado em um fundo de pedra texturizado.

Ubuntu vs. Kubuntu: Qual é melhor para você? Vou te contar agora! 🚀💻

27 de julho de 2025
  • Sobre nós
  • Anunciar
  • política de Privacidade
  • Contate-nos

Copyright © 2025 https://mastertrend.info/ - Todos os direitos reservados. Todas as marcas registradas são propriedade de seus respectivos proprietários.

es_ES Spanish
es_ES Spanish
en_US English
pt_BR Portuguese
fr_FR French
it_IT Italian
ru_RU Russian
de_DE German
zh_CN Chinese
ko_KR Korean
ja Japanese
th Thai
hi_IN Hindi
ar Arabic
tr_TR Turkish
pl_PL Polish
id_ID Indonesian
nl_NL Dutch
sv_SE Swedish
Nenhum resultado
Ver todos os resultados
  • pt_BRPortuguese
    • es_ESSpanish
    • en_USEnglish
    • fr_FRFrench
    • it_ITItalian
    • de_DEGerman
    • ko_KRKorean
    • jaJapanese
    • zh_CNChinese
    • ru_RURussian
    • pl_PLPolish
    • id_IDIndonesian
    • tr_TRTurkish
    • hi_INHindi
    • thThai
    • arArabic
    • sv_SESwedish
    • nl_NLDutch
  • jogos
  • Hardware
  • IA
  • Celulares
  • Notícias
  • Redes
  • Segurança
  • Programas
  • Tutoriais
  • Windows

Copyright © 2025 https://mastertrend.info/ - Todos os direitos reservados. Todas as marcas registradas são propriedade de seus respectivos proprietários.

Informações do autor do comentário
:wpds_smile::wpds_grin::wpds_wink::wpds_mrgreen::wpds_neutro::wpds_twisted::wpds_arrow::wpds_choque::wpds_unamused::wpds_cool::wpds_evil::wpds_oops::wpds_razz::wpds_roll::wpds_cry::wpds_eek::wpds_lol::wpds_mad::wpds_triste::wpds_exclamação::wpds_question::ideia_wpds::wpds_hmm::wpds_beg::wpds_ufa::wpds_risada::wpds_silly::wpds_inveja::wpds_cala a boca:
wpDiscuz
RedditCéu AzulXMastodonteNotícias Hacker
Compartilhe isto:
MastodonteVKO que você acha do WhatsApp?TelegramaSMSNotícias HackerLinhaMensageiro
Sua instância Mastodon