All modern browsers offer mobile emulation tools, and one of the best can be found in Chrome. The post will show you how to Make screenshot of website with device frame in Chrome. It is very useful for developers to check how their web sites look on smartphones and small screen devices.
Here what you need to do:
Start Chrome, navigate to the web page you want to test and open the Developer Tools
(Menu > Tools > Developer Tools, Cmd + Opt + I on macOS or F12 / Ctrl + Shift + I on Windows and Linux).Click the mobile device emulator button to switch the Developer Tools mode
- Show device frame
- Select device to emulate
The drop-down menu on the left allows you to select a device. Several dozen presets are provided for popular smart phones and tablets, including iPhones, iPads, Kindles, Nexus tablets, Samsung Galaxy, and so on.
Not all devices are presented at once. Click Edit… at the bottom of the device drop-down or click the DevTools Settings
*That’s it for now. *
If you liked this article, then please subscribe to my YouTube Channel for video tutorials.
You can also find me on Twitter and Facebook.
The post Make screenshot of website with device frame in Chrome appeared first on Panayiotis Georgiou.
Top comments (2)
I appreciate the time you spent finding that information for me. furnished apartments london
Is there a way to add new device frames?