Независимо от того, являетесь ли вы веб-дизайнером, отлаживающим исходный код своего сайта, или просто хотите узнать, как выглядит код сайта, вы можете просмотреть исходный HTML-код прямо в Google Chrome. Существует два способа просмотра исходного кода HTML: просмотр исходного кода и проверка с использованием инструментов разработчика.
Просмотр источника с использованием просмотра страницы источника
Запустите Chrome и перейдите на веб-страницу, на которой вы хотите просмотреть исходный код HTML. Щелкните правой кнопкой мыши страницу и выберите «Просмотр источника страницы» или нажмите Ctrl + U, чтобы увидеть источник страницы на новой вкладке.
Откроется новая вкладка вместе со всем HTML-кодом для веб-страницы, полностью развернутым и неформатированным.
Если вы ищете определенный элемент или часть в источнике HTML, использование View Source является утомительным и громоздким, особенно если на странице много JavaScript и CSS.
Проверьте источник с помощью инструментов разработчика
Этот метод использует панель инструментов разработчика в Chrome и является гораздо более чистым подходом для просмотра исходного кода. HTML легче читать здесь благодаря дополнительному форматированию и возможности свертывать элементы, которые вам не интересны.
Откройте Chrome и перейдите на страницу, которую вы хотите проверить; затем нажмите Ctrl + Shift + i. Прикрепленная панель откроется рядом с просматриваемой веб-страницей.
Нажмите на маленькую серую стрелку рядом с элементом, чтобы расширить его еще больше.
Если вы не хотите видеть код полной страницы по умолчанию, а вместо этого осмотрите определенный элемент в HTML, щелкните правой кнопкой мыши это место на странице и выберите «Проверить».
Когда панель открывается в этот раз, она переходит непосредственно к той части кода, которая содержит тот элемент, который вы щелкнули
Если вы хотите изменить положение дока, вы можете переместить его внизу, влево, вправо или даже отсоединить в отдельном окне. Нажмите на значок меню (три точки), затем выберите «Отстыковку» в отдельном окне, закрепите слева, закрепите снизу или закрепите справа, соответственно.
Это все, что нужно сделать. Когда вы закончите просматривать код, закройте вкладку «Просмотр исходного кода» или нажмите «X» на панели инструментов разработчика, чтобы вернуться на свою веб-страницу.
