Czy potrzebujesz dostępu do emulatora przeglądarki smartfona na swoim komputerze, aby przetestować mobilną wersję strony, która Cię interesuje? Być może jesteś programistą internetowym lub chcesz nim zostać i musisz symulować przeglądarkę mobilną dla projektu, nad którym pracujesz. Niezależnie^(Regardless) od powodów, oto jak uzyskać dostęp do emulatora przeglądarki mobilnej w Google Chrome , Mozilla Firefox , Microsoft Edge i Opera:

Jak włączyć i używać emulatora przeglądarki mobilnej w Google Chrome

W Google Chrome przejdź do witryny, którą chcesz wyświetlić w emulatorze przeglądarki mobilnej. Następnie naciśnij CTRL + SHIFT + I na klawiaturze lub kliknij myszą trzy pionowe kropki w prawym górnym rogu, aby otworzyć menu „Dostosuj i kontroluj Google Chrome”^{(“Customize and control Google Chrome”)} . Wybierz Więcej narzędzi,^{(More tools, )} a następnie Narzędzia dla programistów^{(Developer Tools)} .

Uzyskaj dostęp do Narzędzi dla programistów^{(Access Developer Tools)} w Google Chrome

Kliknij lub naciśnij przycisk „Przełącz pasek narzędzi urządzenia”^{(“Toggle device toolbar”)} (wygląda jak smartfon obok tabletu) lub naciśnij CTRL + Shift + M na klawiaturze. Aktywuje to pasek narzędzi urządzenia, na którym ładowana jest strona mobilna. Domyślnie pasek narzędzi urządzenia używa szablonu Responsive dla załadowanej witryny. Kliknij^(Click) na niego i wybierz urządzenie mobilne, które chcesz emulować. Twoje opcje obejmują wiele iPhone'ów, iPadów, Surface Duo , dwa urządzenia Samsung Galaxy i symulator przeglądarki mobilnej Moto G4 na komputer PC.^{(Moto G4 mobile)}

Jak włączyć emulator przeglądarki mobilnej w Google Chrome

WSKAZÓWKA: Niestety, ze skrótu klawiaturowego ^(TIP:)CTRL + Shift + M można korzystać dopiero po włączeniu narzędzi programistycznych.

Poruszaj^(Navigate) się po witrynie, którą chcesz przetestować, przełączaj się między różnymi smartfonami i tabletami i zobacz, jak wygląda. Gdy skończysz, naciśnij przycisk X (Zamknij)^{(X (Close))} w prawym górnym rogu narzędzi programistycznych Google Chrome, aby wrócić do standardowego trybu przeglądania na pulpicie.

Zamykanie emulatora przeglądarki mobilnej Google Chrome

WSKAZÓWKA:^(TIP:) jeśli intensywnie korzystasz z przeglądarki Google Chrome^{(Google Chrome)} , możesz również dowiedzieć się , jak korzystać z opcji sterowania multimediami w przeglądarce Google Chrome^{(how to use Google Chrome’s media control options)} .

Jak włączyć i korzystać z emulatora przeglądarki mobilnej w Mozilla Firefox

W przeglądarce Mozilla Firefox^{(Mozilla Firefox)} otwórz witrynę, dla której chcesz użyć symulatora przeglądarki mobilnej. Następnie naciśnij CTRL + Shift + M na klawiaturze lub kliknij przycisk burger w prawym górnym rogu, aby otworzyć menu Firefoksa i wybierz Web Developer .

Uzyskaj dostęp do narzędzi Web Developer w Firefoksie^(Firefox)

Zobaczysz menu wypełnione narzędziami przydatnymi programistom internetowym. Z listy wybierz „Tryb projektowania responsywnego”,^{(“Responsive Design Mode,”)} a ten konkretny tryb przeglądania strony internetowej zostanie załadowany w przeglądarce Firefox^(Firefox) .

Wybierz tryb projektowania responsywnego^{(Responsive Design Mode)} w Firefoksie^(Firefox)

Firefox włącza tryb projektowania responsywnego^{(Responsive Design Mode)} . W górnej części okna zobaczysz parametry używane przez ten tryb emulacji. Jeśli nie wybrano żadnego urządzenia, kliknij lub dotknij Responsywne^(Responsive) , aby otworzyć listę rozwijaną z urządzeniami dostępnymi do emulacji, a następnie wybierz to, które chcesz zasymulować.

Możesz symulować przeglądarkę mobilną dla wielu iPhone'ów, iPada, Kindle Fire ( Firefox jest jedyną przeglądarką, która oferuje tę opcję emulacji) i urządzeń Samsung Galaxy S9 .

Użyj emulatora przeglądarki mobilnej w Firefoksie^(Firefox)

Po zakończeniu testowania za pomocą emulatora przeglądarki smartfona naciśnij przycisk X (Zamknij tryb projektowania responsywnego)^{(X (Close Responsive Design Mode))} w prawym górnym rogu przeglądarki Mozilla Firefox^{(Mozilla Firefox)} .

Zamknij emulator przeglądarki mobilnej w Firefoksie^(Firefox)

Wróciłeś do standardowego trybu przeglądania na pulpicie.

Jak włączyć i korzystać z emulatora przeglądarki mobilnej w Microsoft Edge

Microsoft Edge korzysta z tego samego silnika renderującego co Google Chrome i oferuje te same emulatory przeglądarek smartfonów. Aby uzyskać do nich dostęp, odwiedź witrynę, którą chcesz przetestować, i naciśnij CTRL + SHIFT + I na klawiaturze lub kliknij trzy poziome kropki ( „Ustawienia i więcej”^{(“Settings and more”)} ) w prawym górnym rogu przeglądarki Microsoft Edge . W wyświetlonym menu przejdź do Więcej narzędzi,^{(More tools)} a następnie do Narzędzia dla programistów^{(Developer Tools)} .

Uzyskaj dostęp do narzędzi programistycznych w ^(Developer)Microsoft Edge

Kliknij przycisk „Przełącz emulację urządzenia”^{(“Toggle device emulation”)} (wygląda jak smartfon obok tabletu) lub naciśnij CTRL + Shift + M na klawiaturze. Aktywuje to pasek narzędzi emulatora przeglądarki mobilnej. Domyślnie używa szablonu Responsive dla załadowanej witryny. Kliknij^(Click) na niego i wybierz urządzenie mobilne, które chcesz emulować. Dostępne opcje obejmują te same smartfony i tablety, co Google Chrome .

Uzyskaj dostęp do emulatora przeglądarki mobilnej w Microsoft Edge

Przeglądaj witrynę, którą chcesz przetestować, przełączaj się między różnymi urządzeniami mobilnymi i zobacz, jak wygląda. Po zakończeniu naciśnij przycisk X (Zamknij)^{(X (Close))} w prawym górnym rogu przeglądarki Microsoft Edge.

Zamknij emulator przeglądarki mobilnej w Microsoft Edge

Wróciłeś teraz do standardowego trybu przeglądania na pulpicie.

Jak włączyć i korzystać z emulatora przeglądarki mobilnej w Operze?^(Opera)

W Operze^(Opera) odwiedź stronę internetową, którą chcesz wyświetlić, tak jak na urządzeniu mobilnym. Następnie kliknij ikonę Opery^(Opera) w lewym górnym rogu ( „Dostosuj i kontroluj Operę”^{(“Customize and control Opera”)} ). W menu, które się otworzy, wybierz Deweloper^(Developer) , a następnie Narzędzia dla programistów^{(Developer tools)} . Jeśli wolisz klawiaturę, naciśnij CTRL+Shift+I , aby uzyskać ten sam wynik.

Uzyskaj dostęp do narzędzi programistycznych w Operze

Narzędzia programistyczne^{( Developer tools)} są wyświetlane po prawej stronie okna przeglądarki. Kliknij przycisk „Przełącz pasek narzędzi urządzenia”^{(“Toggle device toolbar”)} (wygląda jak smartfon obok tabletu) lub naciśnij CTRL + Shift + M na klawiaturze. Pasek narzędzi urządzenia jest pokazany po lewej stronie. Domyślnie używa szablonu Responsive dla załadowanej witryny. Kliknij^(Click) na nią i z listy opcji wybierz urządzenie mobilne, które chcesz emulować. Opera oferuje te same emulatory przeglądarek mobilnych co Google Chrome i Microsoft Edge , ponieważ opiera się na tym samym silniku renderującym ( Chromium ).

Uzyskaj dostęp do emulatora przeglądarki mobilnej w Operze^(Opera)

Po zakończeniu testowania naciśnij przycisk X ( Zamknij^(Close) ) w prawym górnym rogu, aby wrócić do standardowego trybu przeglądania na pulpicie.

Zamknij emulator przeglądarki mobilnej w Operze^(Opera)

Czy^(Are) jesteś zadowolony z dostępnych opcji emulacji przeglądarki mobilnej?

Teraz wiesz, jak emulować wszystkie rodzaje urządzeń mobilnych w ulubionej przeglądarce internetowej. Możesz jednak zauważyć, że większość przeglądarek internetowych oferuje te same opcje emulacji, które preferują iPhone'y i iPady. Jeśli chcesz emulować nowoczesny smartfon lub tablet z Androidem^(Android) , Twoje szanse są niewielkie, nawet w Google Chrome – przeglądarce opracowanej przez firmę stojącą za Androidem^(Android) . Jeśli chcesz uzyskać najlepsze wyniki, możesz potrzebować do tego zadania dwóch przeglądarek: Chrome i Firefox lub Firefox i Edge lub Opera . Przed wyjazdem powiedz nam, co myślisz o dostępnych opcjach.

How to use the mobile browser emulator in Chrome, Firefox, Edge, and Opera -

Do you need to access a smartphone browser emulatоr on your PC to test the mobile version of a website yoυ are interested in? Maybe уou are a wеb dеveloper, or you want to become one, and you need to simulate a mobile browser for thе projесt you are working on. Rеgardless of your reasons, here is how to access a mobile browser emulаtor in Google Chrome, Mozilla Firefox, Microsoft Edgе, and Opera:

How to turn on and use the mobile browser emulator in Google Chrome

In Google Chrome, navigate to the website that you want to view in the mobile browser emulator. Then, either press the CTRL + SHIFT + I keys on your keyboard or, with the mouse, click the three vertical dots in the top-right corner to open the “Customize and control Google Chrome” menu. Choose More tools, followed by Developer Tools.

Access Developer Tools in Google Chrome

Click or tap on the “Toggle device toolbar” button (it looks like a smartphone next to a tablet) or press CTRL + Shift + M on your keyboard. This activates the device toolbar where the mobile page is loaded. By default, the device toolbar uses a Responsive template for the site you loaded. Click on it and choose the mobile device that you want to emulate. Your options include many iPhones, iPads, Surface Duo, two Samsung Galaxy devices, and a Moto G4 mobile browser simulator for PC.

How to enable the mobile browser emulator in Google Chrome

TIP: Unfortunately, you can use the CTRL + Shift + M keyboard shortcut only after enabling the developer tools.

Navigate the site you want to test, switch between the different smartphones and tablets, and see how it looks. When you are done, press the X (Close) button in the top-right corner of Google Chrome’s developer tools to get back to the standard desktop browsing mode.

Closing the mobile browser emulator Google Chrome

TIP: If you are a heavy Google Chrome user, you may also want to learn how to use Google Chrome’s media control options.

How to turn on and use the mobile browser emulator in Mozilla Firefox

In Mozilla Firefox, open the site for which you want to use a mobile browser simulator. Then, either press CTRL + Shift + M on your keyboard or click the burger button on the top-right corner to open Firefox’s menu, and choose Web Developer.

Access the Web Developer tools in Firefox

You see a menu filled with tools that are useful to web developers. In the list, select “Responsive Design Mode,” and this particular mode of viewing a web page is loaded in Firefox.

Choose the Responsive Design Mode in Firefox

Firefox enables the Responsive Design Mode. At the top of the window, you see the parameters used by this emulation mode. If no device is selected, click or tap on Responsive to open a drop-down list with devices available for emulation, and then choose the one that you want to simulate.

You can simulate the mobile browser for many iPhones, the iPad, the Kindle Fire (Firefox is the only browser to offer this emulation option), and Samsung Galaxy S9 devices.

Use the mobile browser emulator in Firefox

When you’re done testing with the smartphone browser emulator, press the X (Close Responsive Design Mode) button on the top-right corner of Mozilla Firefox.

Close the mobile browser emulator in Firefox

You are back to the standard desktop browsing mode.

How to turn on and use the mobile browser emulator in Microsoft Edge

Microsoft Edge uses the same rendering engine as Google Chrome and offers the same smartphone browser emulators. To access them, visit the website that you want to test, and either press the CTRL + SHIFT + I keys on your keyboard or click the three horizontal dots (“Settings and more”) in the top-right corner of Microsoft Edge. In the menu that appears, go to More tools and then to Developer Tools.

Access the Developer tools in Microsoft Edge

Click the “Toggle device emulation” button (it looks like a smartphone next to a tablet) or press CTRL + Shift + M on your keyboard. This activates the mobile browser emulator toolbar. By default, it uses a Responsive template for the site you loaded. Click on it and choose the mobile device that you want to emulate. Your options include the same smartphones and tablets as Google Chrome.

Access the mobile browser emulator in Microsoft Edge

Browse the site you want to test, change between the different mobile devices, and see how it looks. When you are done, press the X (Close) button in Microsoft Edge’s top-right corner.

Close the mobile browser emulator in Microsoft Edge

You are now back to the standard desktop browsing mode.

How to turn on and use the mobile browser emulator in Opera

In Opera, visit the web page that you want to view as if you were using a mobile device. Then click the Opera icon on the top-left (“Customize and control Opera”). In the menu that opens, choose Developer followed by Developer tools. If you prefer the keyboard, press the CTRL+Shift+I keys for the same result.

Access the Developer tools in Opera

The Developer tools are displayed on the right side of the browser window. Click the “Toggle device toolbar” button (it looks like a smartphone next to a tablet) or press CTRL + Shift + M on your keyboard. The device toolbar is shown on the left. By default, it uses a Responsive template for the site you loaded. Click on it and choose the mobile device that you want to emulate from the list of options. Opera offers the same mobile browser emulators as Google Chrome and Microsoft Edge, as it is based on the same rendering engine (Chromium).

Access the mobile browser emulator in Opera

When you are done testing, press the X (Close) button in the top-right corner to get back to the standard desktop browsing mode.

Close the mobile browser emulator in Opera

Are you happy with the mobile browser emulation options available?

Now you know how to emulate all kinds of mobile devices in your favorite web browser. However, you might notice that most web browsers offer the same emulation options that favor iPhones and iPads. If you want to emulate a modern Android smartphone or tablet, your chances are pretty slim, even in Google Chrome - the browser developed by the company behind Android. If you want the best results, you might need to use two browsers for this task: Chrome and Firefox, or Firefox and Edge or Opera. Before you go, tell us what you think about the available options.

Related posts

• Jak wyciszyć kartę w Chrome, Firefox, Microsoft Edge i Opera?

• Jak wydrukować artykuł bez reklam we wszystkich głównych przeglądarkach —

• Jak przypiąć witrynę do paska zadań lub menu Start w systemie Windows 10?

• Jak ustawić Chrome jako domyślną przeglądarkę w systemie Windows 10 (Firefox i Opera)

• Jak zmienić domyślną przeglądarkę w systemie Windows 11 -

• Jak ustawić serwer proxy w Chrome, Firefox, Edge i Opera?

• 5 problemów, które sprawiają, że Microsoft Edge jest gorszą przeglądarką internetową od innych

• Jak włączyć i wyłączyć tryb ciemny w Microsoft Edge —

• Jak wyeksportować hasła LastPass do pliku CSV?

• Jaką mam wersję Microsoft Edge? -

• Jak importować hasła do LastPass z Chrome, Firefox, Opera i Microsoft Edge?

• Jak zmienić język w Firefoksie na Windows i Mac

• Informacje o InPrivate i Incognito. Co to jest przeglądanie prywatne? Która przeglądarka jest najlepsza?

• Ustaw Chrome i inne przeglądarki na pełnym ekranie (Edge, Firefox i Opera)

• Gdzie są przechowywane pliki cookie w systemie Windows 10 dla wszystkich głównych przeglądarek?

• Jak włączyć Flash w Firefoksie -

• Jak korzystać z kolekcji Microsoft Edge —

• Chrome 64-bit lub Chrome 32-bit: Pobierz żądaną wersję dla systemu Windows 10 lub starszego

• Jak uruchomić Microsoft Edge w Windows 10 (12 sposobów) —

• Jak powiększyć tekst w przeglądarkach Chrome, Edge, Firefox i Opera?