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