Как настроить в Chrome панель разработчика так, чтобы при работе с ней, внешне был вид реального устройства?
Подскажите пожалуйста, как настроить панель разработчика так, чтобы при работе вид был как на первом фото? Сейчас у меня внешка как на втором?

Заранее спасибо!
Ответы (1 шт):
Для отображения рамки устройства, при активном режиме эмуляции вьюпорта надо вызвать меню (кнопка "три точки" вверху справа) и выбрать пункт "Show device frame":

Рамка отображается не у всех устройств которые можно добавить в список эмулируемых.
И, пункт меню для включения/отключения рамки устройства недоступен при выборе в списке устройств "Responsive", то есть режима свободного изменения размеров вьюпорта.
Больше "скинов" устройств (заявлено 54шт.) есть в браузере Blisk, который тоже основан на исходном коде Chromium. То есть, это почти тот же Chrome - но без встроенной интеграции с гуглосервисами (такими как синхронизация), и с некоторыми дополнительными возможностями взамен (такими как отображение одновременно мобильного и десктопного вида страницы).
// Должен оговориться, что у меня негативный опыт использования Blisk (глючил), но все же советую посмотреть-попробовать: возможно, его старые баги уже устранены...