Cамоучитель по созданию сайтов


Автоматизация ввода



Автоматизация ввода

Теперь давайте обратим внимание на панель инструментов для быстрого ввода тегов (Quick Bar), расположенную в правой верхней части окна программы. Элементы управления, представленные на этой панели, предназначены для автоматизации ввода элементов веб-страницы. Элементы управления сгруппированы в несколько вкладок:

• Common — для ввода тегов, которые используются наиболее часто;

• Fonts — для изменения параметров шрифта;

• Tables — для создания таблиц;

• Frames — для создания фреймовых структур;

• Lists — для создания списков;

• Forms — для ввода элементов форм;

• Script — для подготовки ко вводу сценариев, Java-апплетов и элементов ActiveX;

• CFML—для ввода тегов ColdFusion;

• ASP — для определения некоторых элементов динамических страниц active server pages;

Linkbot — для автоматической проверки ссылок с помощью внешней программы Linkbot.

Если на панели QuickBar видны не все вкладки, щелкните на ней правой кнопкой мыши, и в открывшемся меню отметьте те вкладки, которые хотите сделать видимыми. Подробно разбирать все вкладки панели Quick Bar мы здесь не будем, но общий принцип работы с ними рассмотрим.

На каждой вкладке представлены командные кнопки, с помощью которых можно быстро ввести нужный тег или целый блок-заготовку. Например, если перед вами совершенно чистая страница, нажмите на самую левую кнопку вкладки Common — это кнопка Quick Start (Быстрый старт). Из открывшегося списка можно выбрать тип документа и быстро сгенерировать его .HTML-заголовок. А если нажать вторую кнопку той же вкладки — кнопку Body, то откроется диалоговое окно, в котором можно изменить свойства текущей страницы. Наглядно, с помощью раскрывающегося списка, организован выбор цвета текста и фона, а если ни один из предложенных цветов не подходит, командой Custom (Настроить) можно открыть полную палитру доступных цветов. В небольшом окне справа можно увидеть, как будет смотреться избранное цветовое сочетание.

Для выбора фонового рисунка служит кнопка, расположенная рядом с полем Background Image (Фоновый рисунок). Она открывает стандартное окно выбора файла с возможностью его предварительного просмотра. Конечно, можно ввести название графического файла и просто с клавиатуры.

Для ввода значения атрибута STYLE= также можно воспользоваться раскрывающей кнопкой соответствующего поля. При этом открывается окно внешней программы TopStyle. Это же окно будет открываться при каждой установке атрибута STYLE= для любого тега или при редактировании стилевого блока. В его правой части находится панель Инспектора стилей (Style Inspector), на которой в алфавитном порядке приведены все доступные свойства стилей. Обратите внимание на то, что набор доступных свойств можно изменять в соответствии со своими запросами. Это может быть полный набор из спецификации CSS уровня 1 или 2, или набор свойств, поддерживаемых различными версиями броузеров. Необходимый набор можно выбрать из раскрывающегося списка в Инспекторе стилей.

Значения доступных свойств стилей можно выбирать в Инспекторе с помощью раскрывающихся списков. Правда, некоторые значения, например цифровые значения параметров в соответствующих диалоговых окнах, лучше все-таки вводить вручную. Все изменения значений тут же отображаются в левой части окна TopStyle. По завершении настройки нажмите кнопку Done (Готово) — и соответствующий текст появится в поле ввода Style (Стиль). Теперь обратите внимание на еще одну особенность окна Body . На его нижней панели (там, где имеются поля Left Margin, Top Margin и Fixed Background) изображен значок броузера Internet Explorer 4. Наличие этого значка означает, что атрибуты, представленные в данном разделе, будут ( работать только в этом броузере.

К этому вопросу мы еще вернемся, а пока нажмите кнопку ОК, и вы увидите, что все установленные атрибуты тега <BODY> появились в тексте, например, вот так:

<BODY TEXT="Blue" BACKGROUND="arrowl.gif" BGCOLOR="Fuchsia" LINK="Aqua" VLINK="Black" ALINK="Gray" STYLE="background-position: right;

border-style: dotted; background-repeat: repeat-y;">



- Начало - - Назад - - Вперед -