Paano Kumuha ng Mga Screenshot sa Google Chrome

Sa artikulong ito, ipapakita namin sa iyo kung paano kumuha ng mga screenshot ng mga partikular na elemento ng web page o ang buong web page gamit ang Google Chrome Developer Tools.

Paksa ng Nilalaman:

1. Binubuksan ang Google Chrome Developer Tools
2. Pagpili ng Partikular na Elemento mula sa Webpage Gamit ang Google Chrome Developer Tools
3. Pagkuha ng Mga Screenshot ng Mga Elemento ng Webpage Gamit ang Google Chrome Developer Tools
4. Pagkuha ng Mga Screenshot ng Buong Webpage Gamit ang Google Chrome Developer Tools
5. Konklusyon
6. Mga sanggunian

Binubuksan ang Google Chrome Developer Tools

Upang buksan ang Google Chrome Developer Tools, patakbuhin ang Google Chrome, bisitahin ang web page kung saan mo gustong kumuha ng mga screenshot, at pindutin ang + + ako .

Kung kailangan mo ng anumang tulong sa pagbubukas ng Google Chrome Developer Tools, basahin ang artikulo sa Paano Buksan ang Google Chrome Developer Tools .

Pagpili ng Partikular na Elemento mula sa Webpage Gamit ang Google Chrome Developer Tools

Kung gusto mong kumuha ng mga screenshot ng isang partikular na elemento mula sa web page gamit ang Google Chrome Developer Tools, kailangan mong mapili ang elementong gusto mong kuhanan ng mga screenshot mula sa web page.

Maaari kang pumili ng elemento mula sa web page mula sa tab na 'Mga Elemento' ng Google Chrome Developer Tools.

Maaari mo ring gamitin ang tool na 'Inspect' ng Google Chrome Developer Tools upang pumili ng elemento mula sa web page.

Para gamitin ang inspect tool, mag-click sa

mula sa kaliwang sulok sa itaas ng Google Chrome Developer Tools.

Piliin ang elementong gusto mong kuhanan ng screenshot mula sa web page. Kapag napili na ang elemento, dapat ding awtomatikong mapili ang seksyong HTML code sa tab na 'Mga Elemento'.

Pagkuha ng Mga Screenshot ng Mga Elemento ng Webpage Gamit ang Google Chrome Developer Tools

Upang kumuha ng screenshot ng napiling elemento ng web page, i-right-click (RMB) sa napiling HTML parent element mula sa tab na “Elements” at mag-click sa “Capture node screenshot”.

Ang isang screenshot ng napiling elemento ng web page ay dapat kunin at i-save sa iyong computer.

Tulad ng nakikita mo, matagumpay na nakuha ang isang screenshot ng napiling elemento ng web page.

Subukan nating kumuha ng screenshot ng isa pang elemento ng web page gamit ang Google Chrome Developer Tools.

Piliin ang talaan ng mga nilalaman sa isa sa mga artikulo ng LinuxHint, i-right-click (RMB) dito, at i-click ang 'Capture node screenshot' upang kumuha ng screenshot tulad ng ginawa namin kamakailan.

Ang isang screenshot ay kinuha na ngayon at nai-save.

Tulad ng nakikita mo, ang isang screenshot ng talaan ng mga nilalaman lamang ang kinuha.

Pagkuha ng Mga Screenshot ng Buong Webpage Gamit ang Google Chrome Developer Tools

Upang kumuha ng screenshot ng buong webpage, mag-navigate sa tab na 'Mga Elemento' ng Google Chrome Developer Tools. Mag-scroll pataas at piliin ang html tag. Pinipili nito ang buong web page.

Ngayon, i-right-click (RMB) sa html tag at mag-click sa 'Capture node screenshot'.

Ang isang screenshot ng buong web page ay dapat kunin at i-save sa iyong computer.

Tulad ng nakikita mo, matagumpay na nakuha ang screenshot ng buong web page.

Konklusyon

Ipinakita namin sa iyo kung paano buksan ang Google Chrome Developer Tools. Ipinakita rin namin sa iyo kung paano pumili ng mga partikular na elemento ng web page gamit ang inspect tool ng Google Chrome Developer Tools at kung paano kumuha ng mga screenshot ng mga partikular na elemento ng web page at ang buong web page gamit ang Google Chrome Developer Tools.

Mga sanggunian:

• https://developer.chrome.com/blog/new-in-devtools-62/#node-screenshots