Simulate mobile devices with Device Mode

Veröffentlicht am: 02 Dezember 2022
auf dem Kanal: Chrome for Developers
69,425
698

Want to test your websites on different mobile devices without owning a real one? In this episode, Jecelyn walks you through 5 ways to simulate mobile viewport with the Chrome DevTools Device Mode. 2 bonus tips included!

Chapters:
0:00 Intro
0:23 Toggle Device Toolbar
0:53 Responsive view mode
1:02 Preset media query breakpoints
1:33 Custom media query breakpoints
1:57 Resize with common devices
2:16 Bonus tip: Take a screenshot with mobile device frame
2:28 Add a custom device
2:48 Resize with Rulers mode
3:06 Bonus tip: Simulate your page’s performance

Questions? Tweet to us:
Jecelyn Yeen →   / jecfish  
Chrome DevTools →   / chromedevtools  

Links:
Simulate mobile devices with Device Mode → https://goo.gle/devtools-device-mode
Learn responsive design → https://goo.gle/3UoAO5x
Learn PWA → https://goo.gle/3EUW0KH

Catch more DevTools Tips → https://goo.gle/DevToolsTips
Subscribe to Google Chrome Developers → https://goo.gle/ChromeDevs

#DevToolsTips #Chrome #Developer


Auf dieser Seite können Sie das Online-Video Simulate mobile devices with Device Mode mit der Dauer stunde minuten sekunde in guter Qualität ansehen, das der Benutzer Chrome for Developers 02 Dezember 2022 hochgeladen hat, den Link mit Freunden und Bekannten teilen, dieses Video wurde auf Youtube bereits 69,425 Mal angesehen und es wurde von 698 den Zuschauern gefallen. Viel Spaß beim Betrachtenden Zuschauern gefallen!