2020-06-12
85
Как правило, для создания и редактирования документа достаточно возможностей, которые предоставляет режим редактирования по умолчанию ("Обычный"). Однако если вы хотите получить доступ к исходному коду веб-страницы, вы можете изменить режим редактирования.
Nvu позволяет легко переключаться между четырьмя режимами редактирования (способами отображения страницы). В каждом из этих режимов можно продолжать редактировать документ, однако разметка HTML отображается в них по-разному.
Перед тем, как изменять режимы редактирования:
· Откройте меню "Вид" и выберите пункт "Показать/скрыть". Убедитесь, что в подменю отмечен пункт "Панель режима редактирования".
Панель режима редактирования находится в нижней части окна Nvu и содержит четыре вкладки:
· Обычный: Это режим редактирования WYSIWYG, который позволяет в процессе создания документа видеть то, как он будет показан в браузере. Для удобства редактирования в этом режиме отображаются границы таблиц и значки якорей с именем. Вся остальная разметка HTML остается скрытой.
|
|
|
· HTML-теги: В этом режиме отображаются все теги HTML в виде специальных значков (желтых прямоугольников), а также границы таблиц.
· <HTML>-Код: Этот режим позволяет просматривать и редактировать исходный код документа на языке HTML. При сохранении документа в этом режиме происходит переключение в обычный режим.
· Предварительный просмотр: В этом режиме документ отображается в точности так, как он выглядит в окне браузера. Однако ссылки и сценарии JavaScript не будут действовать в этом режиме.
Примечание: Сценарии JavaScript, фреймы, ссылки и анимированная графика в формате GIF не действуют ни в одном из режимов редактирования. Чтобы проверить действие этих элементов, нажмите кнопку "Просмотр" на панели инструментов. При этом страница будет загружена в отдельное окно браузера.
Использование строки состояния при форматировании веб-страниц
Nvu содержит удобные творческие возможности по редактированию/применению встроенных стилей, а также связыванию классов или ID тегов с выбранным текстом через строку состояния. Изменение стиля через строку состояния возможно в любом режиме, за исключением режима <HTML>-Kод.
· Выбрать: Щелчок по пункту "Выбрать" выделит весь текст, ограниченный стилем тега.
· Удалить тег: Щелчок по пункту "Удалить тег" удалит стиль у тега.
· Изменить тег: Используя эту опцию, пользователь может изменить тег, используемый для текста, с минимальными усилиями. Щелчок по пункту "Изменить тег" позволяет редактировать текст соответствующего тега в строке состояния. Напишите желаемый тег и нажмите клавишу Enter. Заданные по умолчанию свойства тега будут применяться к тексту на веб-странице.
|
|
|
· Inline стили: Пока вы находитесь в режиме "Обычный", "HTML-теги" или "Предварительный просмотр", теги вокруг текущего положения курсора отображаются в строке состояния окна Nvu. Параметры стиля любого тега могут быть изменены через соответствующие пункты контекстного меню. Для изменения встроенного свойства стиля:
1. Щелкните правой кнопкой мыши по тегу, который вы желаете редактировать.
2. Щелкните на пункт "Inline стили".
3. Выберите секцию свойств, которую вы хотите редактировать:
§ Свойства текста
§ Свойства обрамления
§ Свойства фона
§ Свойства бокса
§ Свойства звука
§ Извлечь и создать основной стиль
Выбор любой секции кроме последней откроет соответствующую секции вкладку в Редакторе CSS (подробнее об этом см. раздел Таблицы стилей). С помощью соответствующей секции пользователь может определить свои собственные стили, которые будут сохранены согласно рекомендациям W3C относительно CSS.
Пункт Извлечь и создать основной стиль позволяет пользователю извлекать информацию о стиле в стилевое правило и сохранять его во внешней или внутренней таблице стилей.
· Шаблоны предлагают вам две опции - "Сделать редактируемым" и "Удалить редактируемую область", которые можно использовать при работе с Шаблонами. Более подробно о Шаблонах см. раздел Работа с Шаблонами.
· ID показывает ID тегов (если они доступны) из текущей таблицы стилей применяемой в документе. Для добавления соответствующего стиля к выделенному тексту просто щелкните на имени его ID.
· Класс показывает классы тегов (если они доступны) из текущей таблицы стилей применяемой в документе. Для добавления соответствующего класса к выделенному тексту просто щелкните на имени класса.
· Дополнительные свойства позволяют вам использовать "Редактор дополнительных свойств" для изменения HTML-атрибутов и событий JavaScript для таких объектов как таблицы, изображения, ссылки и т.д. Подробнее см. раздел Редактор дополнительных свойств.
Использование таблиц стилей для ваших веб-страниц
Использование каскадных таблиц стилей
Каскадные таблицы стилей (Cascade Style Sheets, CSS) могут применяться к стилю HTML-документа тремя способами:
1. использование встроенных стилей;
2. использование внутренней таблицы стилей;
3. использование внешней таблицы стилей.
Nvu содержит встроенный редактор стилей, который называется CaScadeS. CaScadeS может использоваться для формирования внутренней или внешней таблицы стилей. В противоположность встроенным стилям, внутренние или внешние стили помогают раздельно хранить содержимое документа и информацию о стиле.
Для создания стиля редактируемого HTML-документа в меню "Инструменты", выберите пункт "Редактор CSS". Редактор имеет два режима работы:
1. Режим новичка: этот режим позволяет создавать правила, связанные с именем класса или с элементом указанного типа.
2. Режим эксперта: этот режим позволяет создавать правила без всяких ограничений.
В случае если нет никакой таблицы стилей, новый стиль будет создан автоматически.
