Как посмотреть исходный код страницы в Гугл Хром

Каждая веб-страница содержит HTML-разметку, благодаря которой создаются сайты и используются пользователями в интернете. Современные веб-обозреватели позволяют просматривать такую разметку, что является немаловажным для разработчиков.

Благодаря этому они могут выполнять тестирование, либо просматривать структуру сайта. Подробнее об этом мы поговорим в сегодняшней статье, и рассмотрим, как открыть код страницы в браузере гугл хром на компьютере и телефоне различными способами.

Что это

Код страницы – это некий набор различных атрибутов, используемых браузером. Благодаря им мы видим содержимое страницы: тексты, таблицы, изображения, видеоклипы и многое другое. Например, код для страницы Google.ru выглядит следующим образом:

Такой способ позволяет разработчикам быстро увидеть ошибку, если она имеется. Кроме того, при необходимости мы можем скопировать HTML-код любого сайта и создать аналогичную страницу на своем компьютере. Далее мы рассмотрим, как можно попасть в окно с кодом двумя способами.

Через компьютер

Десктопная версия браузера разрешает каждому пользователю посмотреть код страницы какого угодно сайта. Возьмем для примера сайт apple.com и посмотрим, как можно узнать HTML-код данной страницы.

Просмотр кода страницы

Открываем код страницы в Google Chrome:

  1. Переходим на страницу, код которой нам нужно посмотреть, и в любой поле кликаем правой кнопкой мыши. В отобразившемся меню кликаем по кнопке «Посмотреть код страницы».

  1. В результате будет отображено новое окно, в котором мы можем посмотреть код веб-страницы.

Также мы можем воспользоваться комбинацией клавиш «CTRL+U» — это альтернативный способ просмотра кода страницы в гугл хром. В таком случае мы также попадем на страницу, запущенную выше.

Инструменты разработчика

Инструменты разработчика – это специальное окно, в котором мы можем не только просматривать HTML-разметку, но и проверять запущенность скриптов, смотреть CSS стили, картинки и многое другое.

Открываем инструменты разработчика:

  1. Переходим на сайт, код страницы которого нужно посмотреть, и в верхнем правом углу кликаем по кнопке в виде троеточия.

  1. В отобразившемся меню выбираем «Дополнительные инструменты».

  1. И переходим в нужный нам раздел «Инструменты разработчика».

  1. Готово! Теперь мы находимся в инструментах разработчика, где можно посмотреть код страницы. По умолчанию данное окно расположено в нижней части браузера, но может быть и в ином месте, например, как на рисунке ниже. В разделе «Elements» мы можем просмотреть весь код, отвечающий за структуру исследуемой веб-страницы.

В данный раздел мы также можем попасть и через клик правой кнопки по пустому полю страницы, как мы делали в предыдущем разделе.

Кроме того, используя комбинацию клавиш «CTRL+SHIFT+I», либо кнопку F12, мы снова попадем в данный раздел.
 Такой способ наиболее удобен, что дает возможность быстро обратить к коду веб-страницы.

Через телефон

Для того, чтобы посмотреть код страницы через мобильное приложение Google Chrome, необходимо воспользоваться одной простой формулой. Перед рассматриваемой ссылкой нужно ввести «view-source:». Например, чтобы узнать код google.com, следует ввести view-source: https://www.google.com.

В результате получаем на смартфоне код указанной веб-страницы:

На этом наша статья подходит к концу, надеемся, что она была для вас полезной. Теперь вы знаете как можно открыть код страницы в гугл хром. Напомним, что сделать это можно простой комбинацией клавиш «CTRL+U» или «CTRL+SHIFT+I». Спасибо за внимание!

Ссылка на основную публикацию
Adblock
detector