Как просмотреть код элемента в Chrome

PDF download Загрузить PDF
Соавтор(ы): Luigi Oppido

PDF download Загрузить PDF

Из этой статьи вы узнаете, как в компьютерной версии Google Chrome просмотреть исходный HTML-код визуального элемента на любой веб-странице.

Шаги

PDF download Загрузить PDF
  1. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/b\/bf\/Inspect-Element-on-Chrome-Step-1-Version-2.jpg\/v4-460px-Inspect-Element-on-Chrome-Step-1-Version-2.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/b\/bf\/Inspect-Element-on-Chrome-Step-1-Version-2.jpg\/v4-728px-Inspect-Element-on-Chrome-Step-1-Version-2.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Нажмите на разноцветный круглый значок с синим центром. Он находится в папке «Программы» (Mac) или в меню «Пуск» (Windows).
  2. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/b\/b1\/Inspect-Element-on-Chrome-Step-2-Version-2.jpg\/v4-460px-Inspect-Element-on-Chrome-Step-2-Version-2.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/b\/b1\/Inspect-Element-on-Chrome-Step-2-Version-2.jpg\/v4-728px-Inspect-Element-on-Chrome-Step-2-Version-2.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Вы найдете его у адресной строки в правом верхнем углу окна браузера. Раскроется меню.
  3. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/0\/05\/Inspect-Element-on-Chrome-Step-3-Version-2.jpg\/v4-460px-Inspect-Element-on-Chrome-Step-3-Version-2.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/0\/05\/Inspect-Element-on-Chrome-Step-3-Version-2.jpg\/v4-728px-Inspect-Element-on-Chrome-Step-3-Version-2.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Откроется подменю.
  4. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/2\/24\/Inspect-Element-on-Chrome-Step-4-Version-2.jpg\/v4-460px-Inspect-Element-on-Chrome-Step-4-Version-2.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/2\/24\/Inspect-Element-on-Chrome-Step-4-Version-2.jpg\/v4-728px-Inspect-Element-on-Chrome-Step-4-Version-2.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    В правой части окна браузера откроется панель разработчика.
    • Также эту панель можно открыть, если нажать ⌥ Option + ⌘ Cmd + I (Mac) или Ctrl + Alt + I (Windows).
  5. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/0\/0f\/Inspect-Element-on-Chrome-Step-5-Version-2.jpg\/v4-460px-Inspect-Element-on-Chrome-Step-5-Version-2.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/0\/0f\/Inspect-Element-on-Chrome-Step-5-Version-2.jpg\/v4-728px-Inspect-Element-on-Chrome-Step-5-Version-2.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Этот элемент будет выделен на веб-странице.
  6. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/a\/ad\/Inspect-Element-on-Chrome-Step-6-Version-2.jpg\/v4-460px-Inspect-Element-on-Chrome-Step-6-Version-2.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/a\/ad\/Inspect-Element-on-Chrome-Step-6-Version-2.jpg\/v4-728px-Inspect-Element-on-Chrome-Step-6-Version-2.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Щелкните правой кнопкой мыши по элементу на веб-странице, код которого нужно просмотреть. Раскроется меню.
  7. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/2\/20\/Inspect-Element-on-Chrome-Step-7-Version-2.jpg\/v4-460px-Inspect-Element-on-Chrome-Step-7-Version-2.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/2\/20\/Inspect-Element-on-Chrome-Step-7-Version-2.jpg\/v4-728px-Inspect-Element-on-Chrome-Step-7-Version-2.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Содержимое панели разработчика автоматически прокрутится до выбранного элемента, а его код будет выделен.
    • Для этого не нужно открывать панель разработчика вручную. Когда вы нажмете «Показать код», панель разработчика откроется автоматически.
    Реклама

Дополнительные статьи

Как
изменить основной язык Google Chrome
Как
изменить фон в Google
Как
убрать поисковик Bing из браузера Chrome
Как
включить или отключить автоматическое открытие PDF–файлов в Chrome на компьютере
Как
полностью отключить обновление Google Chrome
Как
перенести закладки браузера с одного компьютера на другой
Как
изменить свой регион в Google Chrome
Как
поставить пароль на Google Chrome
Как
скачать Google Chrome
Как
восстановить Google Chrome
Как
экспортировать закладки из Chrome
Как
избавиться от подсказок в Chrome
Как
переключать вкладки в Chrome
Как
скрыть вкладки в Chrome
Реклама

Об этой статье

На других языках
Эту страницу просматривали 29 620 раз.

Была ли эта статья полезной?

Реклама