Чтобы просмотреть связанный с текстом или объектом HTML-код, выполните одно из следующих действий.
Последнее обновление
20 дек. 2021 г.
Выбор и просмотр элементов в Dreamweaver, отображение или скрытие маркеров невидимых элементов и настройка установок невидимых элементов.
Чтобы выделить элемент в представлении «Дизайн» области «Окно документа», щелкните этот элемент. Если элемент невидим, для выделения его необходимо сделать видимым.
Некоторые части HTML-кода не могут быть представлены в браузере визуально. Например, теги comment в браузерах не отображаются. Однако при создании страницы может быть полезной возможность выделения, редактирования, перемещения и удаления невидимых элементов.
Dreamweaver позволяет указать, отображать ли значки расположения невидимых элементов в представлении «Дизайн» области «Окно документа». Чтобы указать, какие маркеры элементов должны отображаться, можно задать установки в разделе «Невидимые элементы». Например, можно указать отображение именованных привязок, но не разрывов строк.
Некоторые невидимые элементы (например, комментарии или именованные привязки) можно создавать и изменять с помощью диалогового окна «Настройки» > «Невидимые элементы».
Выделение элементов
Чтобы выделить видимый элемент в области «Окно документа», щелкните этот элемент или перетащите по нему указатель мыши.
Чтобы выделить невидимый элемент, в представлении «Дизайн» выберите пункт «Просмотр» > «Параметры представления "Дизайн"» > «Средства визуализации» > «Невидимые элементы» (если этот пункт еще не выбран), после чего щелкните маркер элемента в области окна документа.
Некоторые объекты отображаются на странице в месте, отличном от места вставки их кода. Например, в представлении «Дизайн» элемент с абсолютным позиционированием (элемент AP) может находиться в любом месте страницы, но в представлении «Код» расположение его кода зафиксировано. При отображении невидимых элементов в области «Окно документа» Dreamweaver отображаются маркеры, указывающие расположение кода таких элементов. При выделении маркера выделяется весь элемент; например, при выделении маркера элемента AP выделяется весь элемент AP.
Чтобы выделить весь тег (включая содержимое, при его наличии), щелкните его в селекторе тегов в левом нижнем углу области «Окно документа». (Селектор тегов отображается как в представлении «Дизайн», так и в представлении «Код».) В селекторе тегов всегда отображаются теги, содержащие текущий выделенный фрагмент или позицию курсора. Крайний левый тег — это самый внешний тег, содержащий текущий выделенный фрагмент или позицию курсора. Следующий тег содержится в упомянутом самом внешнем теге и так далее; крайний правый тег — это самый внутренний тег, содержащий текущий выделенный фрагмент или позицию курсора.
Просмотр HTML-кода
На панели инструментов «Документ» нажмите кнопку «Код».
Выберите «Просмотр» > «Код».
Выберите параметр «Просмотр» > «Разделить» > «Код-Интерактивный», «Код-Дизайн» или «Код-Код».
Выберите «Окно» > «Инспектор кода».
При выделении какого-либо фрагмента в одном из редакторов кода (в представлении «Код» или инспекторе кода) он обычно также выделяется и в области «Окно документа». Для отображения выделенного фрагмента может потребоваться синхронизация двух представлений.
Показать или скрыть значки маркеров для невидимых элементов
Выберите «Просмотр» > «Параметры представления "Дизайн"» > «Средства визуализации» > «Невидимые элементы».
Примечание
Отображение невидимых элементов может незначительно изменить макет страницы, сдвинув другие элементы на несколько пикселей, поэтому для точного макета скройте невидимые элементы.
Задание установок невидимых элементов
Используйте настройки невидимых элементов, чтобы указать, какие типы элементов будут видимы при выборе View > Visual Aids > Invisible Elements.
Выберите Edit > Preferences (Windows)
или Dreamweaver > Preferences (Macintosh),
затем нажмите Invisible Elements.
Выберите элементы, которые должны быть видимыми, и нажмите
OK.
Флажок рядом с именем элемента в диалоговом окне означает, что элемент видим при выборе View > Visual Aids > Invisible Elements.
Именованные привязки
Отображает значок, который отмечает расположение каждой именованной привязки (a name = "") в документе.
Сценарии
Отображает значок, который отмечает расположение кода JavaScript или VBScript в теле документа.Выберите значок для редактирования скрипта в инспекторе свойств или для связывания с внешним файлом скрипта.
Комментарии
Отображает значок, который отмечает расположение комментариев HTML.Выберите значок, чтобы просмотреть комментарий в инспекторе свойств.
Разрывы строк
Отображает значок, который отмечает расположение каждого разрыва строки (BR).По умолчанию этот параметр не выбран.
Клиентские карты ссылок
Отображает значок, отмечающий расположение каждой клиентской карты изображений в документе.
Внедренные стили
Отображает значок, показывающий расположение стилей CSS, встроенных в раздел body документа. Если стили CSS размещены в разделе head документа, они не отображаются в окне «Документ».
Скрытые поля формы
Отображает значок, отмечающий расположение полей формы, для которых атрибут type установлен как "hidden".
Разделитель форм
Отображает рамку вокруг формы, чтобы показать, где можно вставить элементы формы. Рамка показывает границы тега form, поэтому любые элементы формы внутри этой рамки правильно заключены в теги form.
Опорные точки для элементов AP
Отображает значок, отмечающий расположение кода, определяющего AP-элемент. Сам элемент AP может быть расположен в любом месте страницы. (AP-элементы не являются невидимыми элементами; невидимым является только код, определяющий AP-элемент.) Выберите значок, чтобы выбрать AP-элемент; затем вы сможете увидеть содержимое AP-элемента, даже если он обозначен как скрытый.
Опорные точки для выровненных элементов
Отображает значок, показывающий расположение HTML-кода для элементов, которые принимают атрибут align. К ним относятся изображения, таблицы, объекты ActiveX, подключаемые модули и апплеты. В некоторых случаях код элемента может быть отделен от видимого объекта.
Отображаемые серверные теги разметки
Отображает расположение серверных тегов разметки (например, тегов Active Server Pages и ColdFusion), содержимое которых нельзя отобразить в окне «Документ».Эти теги обычно создают HTML-теги при обработке сервером. Например, тег <CFGRAPH> создает HTML-таблицу при обработке сервером ColdFusion. Dreamweaver представляет тег с невидимым элементом ColdFusion, поскольку Dreamweaver не может определить финальный, динамический вывод страницы.
Неотображаемые серверные теги разметки
Отображает расположение тегов серверной разметки (таких как теги Active Server Pages и теги ColdFusion), содержимое которых не может отображаться в окне документа. Эти теги обычно представляют собой теги настройки, обработки или логики (например, <CFSET>, <CFWDDX> и <CFXML>), которые не создают HTML-теги.
Отображение CSS: Нет
Отображает значок, показывающий расположение контента, скрытого свойством display:none в связанной или встроенной таблице стилей.
Показывать динамический текст в виде
Отображает любой динамический текст на вашей странице в формате {Recordset:Field} по умолчанию. Если длина этих значений достаточно велика, чтобы исказить форматирование вашей страницы, вы можете изменить отображение на {} вместо этого.
SSI
Отображает текущее содержимое каждого файла SSI.
Связанные материалы
Создание красивых веб-сайтов в Dreamweaver
Создавайте дизайн, пишите код и управляйте динамическими веб-сайтами с помощью многофункционального инструмента.
