Почему нельзя исследовать элемент

Почему нельзя исследовать элемент

Почему нельзя исследовать элемент

Почему нельзя исследовать элемент

Часть 1 Исследование элементов

  1. Изображение с названием Use the Inspect Element in Mozilla Firefox Step 1

    1

    Обновите Firefox (если хотите). Вы не сможете активировать все функции, описываемые в данной статье, если работаете со старой версией Firefox. Определите вашу версию этого браузера, чтобы запустить его автоматическое обновление.
    • В Firefox 9 и более ранних версиях функции «Исследовать элемент» вообще нет.
  2. Изображение с названием Use the Inspect Element in Mozilla Firefox Step 2

    2

    Щелкните правой кнопкой мыши по любому элементу веб-страницы, например, по изображению, тексту, фону или другому элементу. Если у вас нет двухкнопочной мыши, зажмите Control и щелкните по элементу левой кнопкой мыши.

  3. Изображение с названием Use the Inspect Element in Mozilla Firefox Step 3

    3

    В открывшемся меню выберите «Исследовать элемент». В нижней части окна отобразится панель инструментов, а под ней – подокно с HTML кодом страницы.

  4. Изображение с названием Use the Inspect Element in Mozilla Firefox Step 4

    4

    Разберитесь с панелями инструментов и подокнами. Выбрав «Исследовать элемент», в нижней части окна откроется несколько подокон. Вот их описание:
    • Верхняя строка – это панель инструментов. Она включает несколько вкладок, но нас интересует самая первая (слева) вкладка «Инспектор» (окрашена синим цветом). Не переключайтесь на другие вкладки.
    • Под панелью инструментов расположена строка с отладочными операторами.
    • Ниже расположено подокно с HTML кодом страницы. HTML код выбранного вами элемента будет выделен (синим маркером) и расположен по центру этого подокна.
    • В подокне справа вы найдете CSS этой страницы.
  5. Изображение с названием Use the Inspect Element in Mozilla Firefox Step 5

    5

    Выберите другой элемент. Открыв подокно функции «Исследовать элемент», вы можете запросто выбрать другой элемент одним из трех способов:
    • Наведите указатель мыши на строку HTML кода, чтобы выделить соответствующий элемент (в Firefox 34+). Щелкните по HTML коду, чтобы выбрать этот элемент.
    • Щелкните по значку «Выбрать элемент со страницы». Этот значок расположен на панели инструментов слева и имеет вид квадрата с курсором. Наведите курсор на нужный элемент (в подокне с HTML кодом), а затем щелкните по элементу, чтобы выбрать его.
  6. Изображение с названием Use the Inspect Element in Mozilla Firefox Step 6

    6

    Навигация по HTML коду. Щелкните по любой области в подокне с HTML кодом. Используйте клавиши со стрелками (на клавиатуре), чтобы перемещаться по коду (в Firefox 39+). Это полезно в том случае, если элемент довольно маленький.
    • HTML код, представленный серым шрифтом, относится к элементам, которые не отображаются на странице. Например, комментарии, узлы (такие как <head>) и элементы, скрытые при помощи CSS.
    • Щелкните по стрелке слева от контейнера, чтобы развернуть или скрыть его содержимое. Чтобы развернуть все контейнеры, при щелчке по стрелке зажмите Alt или Option.
  7. Изображение с названием Use the Inspect Element in Mozilla Firefox Step 7

    7

    Найдите элемент. На строке с отладочными операторами найдите значок в виде лупы (справа). Щелкните по этому значку, чтобы открыть строку поиска, и введите в ней HTML код, который вы ищете. По мере ввода откроется всплывающее окно с соответствующими элементами. Щелкните по нужному элементу и прокрутите HTML код, чтобы найти код этого элемента.

Часть 2 Редактирование HTML кода

  1. Изображение с названием Use the Inspect Element in Mozilla Firefox Step 8

    1

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

  2. Изображение с названием Use the Inspect Element in Mozilla Firefox Step 9

    2

    Дважды щелкните по HTML коду, чтобы отредактировать его. Введите новый код и нажмите Enter, чтобы сохранить изменения.

  3. Изображение с названием Use the Inspect Element in Mozilla Firefox Step 10

    3

    Нажмите и удерживайте строку с отладочными операторами, чтобы получить доступ к дополнительным опциям. Эта строка расположена между панелью инструментов и подокном с HTML кодом. Вот неполный список дополнительных опций:
    • «Править как HTML». Позволяет редактировать целый узел и все его содержимое, а не отдельные строки.
    • «Копировать внутренний HTML». Копирует все содержимое узла, а опция «Копировать внешний HTML» копирует и узел (например, <div> или <body>).
    • «Вставить». Откроются варианты вставки, например, перед узлом или после узла.
    • «:hover», «:active», «:focus». Меняют внешний вид элемента. Точный эффект определяется CSS (редактируется в правом подокне).
  4. Изображение с названием Use the Inspect Element in Mozilla Firefox Step 11

    4

    Перетаскивание. Чтобы переставить элементы, нажмите и удерживайте HTML код до тех пор, пока не отобразится пунктирная линия. Переместите ее вверх или вниз и отпустите, когда линия достигнет нужного положения.
    • Это работает только в FireFox 39+.
  5. Изображение с названием Use the Inspect Element in Mozilla Firefox Step 12

    5

    Закройте подокна функции «Исследовать элементы». Для этого просто нажмите на значок «X» (в правом дальнем углу панели инструментов).

Советы

  • Вы также можете открыть панель инструментов следующим образом:
    • Windows. Нажмите «Firefox» – «Разработчик» – «Панель инструментов».
    • Mac OS или Linux. Нажмите «Инструменты» – «Разработчик» – «Панель инструментов».
  • В Firefox 40 вы можете скрыть подокно с CSS кодом, чтобы расширить подокно с HTML кодом. Для этого на строке с отладочными операторами найдите значок в виде стрелки, направленной вправо (рядом с лупой). Щелкните по этому значку, чтобы скрыть подокно с CSS кодом; еще раз щелкните по значку, чтобы развернуть это подокно.
  • Вы также можете отредактировать CSS код, но это выходит за рамки данной статьи. Поэтому прочитайте .

Эту страницу просматривали 13 153 раз.

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

 


Источник: https://ru.wikihow.com/%D0%B8%D1%81%D0%BF%D0%BE%D0%BB%D1%8C%D0%B7%D0%BE%D0%B2%D0%B0%D1%82%D1%8C-%D1%84%D1%83%D0%BD%D0%BA%D1%86%D0%B8%D1%8E-%C2%AB%D0%98%D1%81%D1%81%D0%BB%D0%B5%D0%B4%D0%BE%D0%B2%D0%B0%D1%82%D1%8C-%D1%8D%D0%BB%D0%B5%D0%BC%D0%B5%D0%BD%D1%82%C2%BB-%D0%B2-Mozilla-Firefox


Почему нельзя исследовать элемент

Почему нельзя исследовать элемент

Почему нельзя исследовать элемент

Почему нельзя исследовать элемент

Почему нельзя исследовать элемент

Почему нельзя исследовать элемент

Почему нельзя исследовать элемент

Почему нельзя исследовать элемент

Почему нельзя исследовать элемент

Почему нельзя исследовать элемент

Почему нельзя исследовать элемент