Come fare screenshot su Google Chrome
In questo articolo, ti mostreremo come fare schermate di elementi di pagina Web specifici o l'intera pagina Web utilizzando gli strumenti di sviluppatori di Google Chrome.
Argomento dei contenuti:
- Aprire gli strumenti di sviluppatori di Google Chrome
- Selezione di un elemento specifico dalla pagina Web utilizzando gli strumenti di sviluppatori di Google Chrome
- Assumere screenshot degli elementi della pagina web utilizzando gli strumenti di sviluppatori di Google Chrome
- Assumere screenshot della pagina Web completa utilizzando gli strumenti di sviluppatori di Google Chrome
- Conclusione
- Riferimenti
Aprire gli strumenti di sviluppatori di Google Chrome
Per aprire gli strumenti di sviluppatori di Google Chrome, eseguire Google Chrome, visitare la pagina Web di cui si desidera fare screenshot e premere + + IO.
Se hai bisogno di assistenza per aprire gli strumenti di sviluppatori di Google Chrome, leggi l'articolo su come aprire gli strumenti di sviluppatori di Google Chrome.
Selezione di un elemento specifico dalla pagina Web utilizzando gli strumenti di sviluppatori di Google Chrome
Se si desidera eseguire le schermate di un elemento specifico dalla pagina Web utilizzando gli strumenti di sviluppatori di Google Chrome, è necessario essere in grado di selezionare l'elemento che si desidera prendere screenshot dalla pagina Web.
È possibile selezionare un elemento dalla pagina Web dalla scheda "elementi" degli strumenti di sviluppatori di Google Chrome.
È inoltre possibile utilizzare lo strumento "Ispeziona" degli strumenti di sviluppatori di Google Chrome per selezionare un elemento dalla pagina Web.
Per utilizzare lo strumento Ispezione, fare clic su
Dall'angolo in alto a sinistra degli strumenti per sviluppatori di Google Chrome.
Seleziona l'elemento di cui si desidera fare uno screenshot dalla pagina web. Una volta selezionato l'elemento, la sezione del codice HTML deve essere selezionata automaticamente anche nella scheda "Elements".
Assumere screenshot degli elementi della pagina web utilizzando gli strumenti di sviluppatori di Google Chrome
Per fare uno screenshot dell'elemento pagina Web selezionato, fare clic con il pulsante destro del mouse (RMB) sull'elemento genitore HTML selezionato dalla scheda "Elementi" e fare clic su "Schermatura del nodo di acquisizione".
Uno screenshot dell'elemento pagina Web selezionato dovrebbe essere prelevato e salvato sul tuo computer.
Come puoi vedere, uno screenshot dell'elemento pagina Web selezionato viene effettuato correttamente.
Proviamo a fare uno screenshot di un altro elemento della pagina Web utilizzando gli strumenti di sviluppatori di Google Chrome.
Seleziona il tavolo dei contenuti in uno degli articoli Linuxhint, fai clic con il pulsante destro del mouse (RMB) e fai clic su "Screenshot del nodo di acquisizione" per fare uno screenshot proprio come abbiamo fatto di recente.
Uno screenshot è ora preso e salvato.
Come puoi vedere, viene prelevato uno screenshot solo del contenuto.
Assumere screenshot della pagina Web completa utilizzando gli strumenti di sviluppatori di Google Chrome
Per fare uno screenshot della pagina Web completa, vai alla scheda "Elementi" degli strumenti di sviluppatori di Google Chrome. Scorri fino in fondo e seleziona il tag HTML. Questo seleziona l'intera pagina Web.
Ora, fai clic con il pulsante destro del mouse (RMB) sul tag HTML e fai clic su "Screenshot dei nodi di acquisizione".
Uno screenshot dell'intera pagina web dovrebbe essere prelevato e salvato sul tuo computer.
Come puoi vedere, lo screenshot della pagina web completa viene prelevato correttamente.
Conclusione
Ti abbiamo mostrato come aprire gli strumenti di sviluppatori di Google Chrome. Ti abbiamo anche mostrato come selezionare elementi specifici della pagina Web utilizzando lo strumento Ispezione degli strumenti di Google Chrome Developer e come fare schermate di elementi di pagina Web specifici e la pagina Web completa utilizzando gli strumenti di sviluppatori di Google Chrome.
Riferimenti:
- https: // sviluppatore.cromo.com/blog/new-in-devtools-62/#node-screenshots