Что такое панель разработчика?
DevTools — это набор инструментов, встроенных в браузер, для создания и отладки сайтов. С их помощью можно просматривать исходный код сайта, отлаживать работу frontend: HTML, CSS и JavaScript. Также DevTools позволяет проверять сетевой трафик, быстродействие сайта и многое другое.
Панель разработчика находится в нижней части вашего браузера :
Как её отобразить?
Есть три варианта:
Клавиатура. Ctrl + Shift + I, кроме
Internet Explorer. (клавиша - F12)
Mac OS X. (сочетание клавиш - ⌘ + ⌥ + I )
Панель Меню.
Firefox. Открыть меню _➤ ➤ Инструменты разработки, или Инструменты ➤ Веб-разработка ➤ Инструменты разработки
Chrome. Дополнительные инструменты ➤ Инструменты разработчика
Safari. Разработка ➤ Показать Web Inspector . Если вы не видите меню "Разработка", зайдите в Safari ➤ Настройки ➤ Дополнительно, и проверьте стоит ли галочка напротив "Показать меню разработки".
Opera. Меню ➤ Разработка ➤ Инструменты разработчика. Если вы не видите меню "Разработка", включите его отображение, перейдя в Меню ➤ Другие инструменты ➤ Показать меню разработчика.
Контекстное меню. Нажмите правой кнопкой мыши на любом участке веб-страницы (Ctrl-клик для Mac), появится контекстное меню, в котором вам нужно выбрать пункт Исследовать Элемент. (дополнение: этот способ отобразит вам код того элемента, на котором вы щёлкнули правой кнопкой.)
DevTools — это набор инструментов, встроенных в браузер, для создания и отладки сайтов. С их помощью можно просматривать исходный код сайта, отлаживать работу frontend: HTML, CSS и JavaScript. Также DevTools позволяет проверять сетевой трафик, быстродействие сайта и многое другое.
Панель разработчика находится в нижней части вашего браузера :
Как её отобразить?
Есть три варианта:
Клавиатура. Ctrl + Shift + I, кроме
Internet Explorer. (клавиша - F12)
Mac OS X. (сочетание клавиш - ⌘ + ⌥ + I )
Панель Меню.
Firefox. Открыть меню _➤ ➤ Инструменты разработки, или Инструменты ➤ Веб-разработка ➤ Инструменты разработки
Chrome. Дополнительные инструменты ➤ Инструменты разработчика
Safari. Разработка ➤ Показать Web Inspector . Если вы не видите меню "Разработка", зайдите в Safari ➤ Настройки ➤ Дополнительно, и проверьте стоит ли галочка напротив "Показать меню разработки".
Opera. Меню ➤ Разработка ➤ Инструменты разработчика. Если вы не видите меню "Разработка", включите его отображение, перейдя в Меню ➤ Другие инструменты ➤ Показать меню разработчика.
Контекстное меню. Нажмите правой кнопкой мыши на любом участке веб-страницы (Ctrl-клик для Mac), появится контекстное меню, в котором вам нужно выбрать пункт Исследовать Элемент. (дополнение: этот способ отобразит вам код того элемента, на котором вы щёлкнули правой кнопкой.)