Начиная с Firefox 47, "3D view" больше недоступен.
Существует дополнение Tilt 3D. Обратите внимание, что дополнение не работает с multiprocess Firefox.
Когда вы нажимаете на кнопку 3D просмотра, страница переходит в 3D режим. В нем вы можете видетьструктуру блоков HTML, когда вложеные блоки находятся выше родительских.
Этот режим позволяет визуализировать структуру вашего контента.
Нажимая и перетаскивая представление, вы можете поворачивать и переориентировать трехмерную презентацию иерархии DOM на своей странице, чтобы увидеть ее под разными углами, чтобы лучше изучить ее структуру. Элементы вне экрана становятся видимыми, чтобы вы могли видеть, где находятся ваши элементы по отношению к видимому контенту. Вы можете щелкнуть по элементам, чтобы увидеть их HTML на панели HTML или на панели «Стиль». И наоборот, вы можете щелкнуть элементы на панели поиска, чтобы изменить, какой элемент выбран в 3D-представлении.
Если вы не видите кнопку 3D в инспекторе страницы, возможно, что ваш графический драйвер нуждается в обновлении. Дополнительную информацию см. На странице драйверов.
Управление
Для 3D-просмотра доступны горячие клавиши.
| Function | Keyboard | Mouse |
| Zoom in/out | + / - | Scroll wheel up/down |
| Rotate left/right | a / d | Mouse left/right |
| Rotate up/down | w / s | Mouse up/down |
| Pan left/right | ← / → | Mouse left/right |
| Pan up/down | ↑ / ↓ | Mouse up/down |
| Reset zoom level | 0 | Resets the zoom level to the default |
| Focus on selected node | f | Makes sure the currently selected node is visible |
| Reset view | r | Resets zoom, rotation, and panning to the default |
| Hide current node | x | Makes the currently selected node invisible; this can be helpful if you need to get at a node that's obscured |
Варианты использования
Существует множество способов использования 3D-вида:
- Если вы накосячили с HTML-макетом, просмотр 3D-вида поможет найти, где вы налажали. Часто проблемы структур вызваны неправильным вложением содержимого. Это будет более очевидным при использовании 3D-вида.
- Если контент не отображается, вы можете выяснить, почему; поскольку 3D-вид позволяет вам уменьшить масштаб, чтобы увидеть элементы, которые визуализируются за пределами видимой области страницы.
- Вы можете посмотреть, как структурирована ваша страница, чтобы понять, стоит ли ее оптимизировать.
- Ну и ... это шщ-и-и-и-и-и-карно.