</font></body>
В данном случае настройки шрифта применены к тексту
Этот файл создан для примера
. Справа от кнопки
Шрифт
находится четыре кнопки, предназначенные для выравнивания выделенного текстового блока соответственно по центру, по левому краю, по правому краю и по ширине (названия этих кнопок отображаются в виде всплывающих подсказок при подведении к ним указателя мыши). При нажатии любой из них в программный код страницы будут внесены соответствующий изменения. Далее следуют кнопки, с помощью которых можно включить полужирное, курсивное, подчеркнутое или зачеркнутое начертание шрифта. Если, например, вы хотите отобразить какое-то слово или словосочетание полужирным шрифтом – выделите его, а затем нажмите кнопку
Ж
. В результате выделенный фрагмент будет заключен в теги <b> </b>
, которые, как известно, включают полужирное начертание. Следующая кнопка называется
Параграф
. Она предназначена для разбиения текста на параграфы. При ее нажатии в программный код документа вставляется тег с атрибутом <p class='text'></p
>. При необходимости вы можете вручную добавить атрибут align
: в зависимости от значения (left
, center
или right
) он позволяет выровнять параграф соответствующим образом по горизонтали. Далее следует кнопка, которая называется
Перенос строки
. Уже судя по отображаемым на ней символам (BR
) нетрудно догадаться, что она предназначена для перевода текста на следующую строку, то есть для создания абзаца. При ее нажатии в программный код (а именно – в то его место, где в данный момент находится курсор) будет вставлен тег <br>
(фрагмент такого кода показан в листинге 2.2). Листинг 2.2.
Перевод текста на следующую строку <body>
Этот файл создан для примера.<br>Если нужно, будет сформирован еще один такой файл.
</body>
В данном примере вторая фраза будет начата с новой строки.
Следующие четыре кнопки предназначены для создания неупорядоченных, нумерованных и маркированных списков. При их нажатии в программный код добавляются соответствующие теги (например, при создании неупорядоченного списка – теги
<ul>
и </ul>
, и т.д.). ПРИМЕЧАНИЕ
С помощью соответствующих кнопок вы можете формировать маркированные списки как с квадратными, так и с круглыми маркерами.
Далее следует шесть кнопок, которые перечислены ниже (напомним, что их названия отображаются в виде всплывающих подсказок при подведении указателя мыши).
•
Мелкий шрифт
– при нажатии данной кнопки выделенный текстовый фрагмент будет отображаться на веб-странице уменьшенным шрифтом относительно расположенного рядом текста. •
Крупный шрифт
– при нажатии данной кнопки выделенный текстовый фрагмент будет отображаться на веб-странице укрупненным шрифтом относительно расположенного рядом текста. •
Нижний индекс
и Верхний индекс
– эти кнопки предназначены для сдвига выделенного слова или текстового фрагмента соответственно вниз или вверх относительно расположенного рядом текста (иначе говоря, включается нижний или верхний индекс). •
Форматированный текст
– данную кнопку удобно использовать для вставки в программный код веб-страницы уже отформатированного текста. У этого текста будут сохранены все пробелы и переносы. •
Текст фиксированной ширины
– при нажатии данной кнопки выделенный текст будет отображаться в окне Интернет-обозревателя моноширинным шрифтом. Последний параметр на данной вкладке предназначен для формирования заголовков. Как мы уже отмечали ранее, в языке HTML возможно использование заголовков шести уровней. Поэтому вначале нужно выделить слово или словосочетание, которое будет являться заголовком, затем из раскрывающегося списка выбрать требуемый уровень заголовка и нажать кнопку
Заголовок
(на ней отображается символ Н
). Вставка специальных элементов
Возможности программы предусматривают вставку в контент веб-страницы специальных элементов – гиперссылок, изображений, фреймов и т. д. Необходимый для этого инструмент находится на вкладке
Специальные
, содержимое которой показано на рис. 3.6. 
Рис. 3.6.
Вкладка Специальные Ранее мы уже говорили о том, что одним из главных элементов любой веб-страницы является гиперссылка. В программе CatsHtml процесс создания гиперссылок автоматизирован: для этого нужно воспользоваться кнопкой
Вставить ссылку
, которая является на вкладке Специальные
крайней слева. Чтобы вставить гиперссылку, нужно выделить слово или текстовый фрагмент, который будет являться ссылкой, и нажать кнопку
Вставить ссылку
. В листинге 2.3 показан фрагмент программного кода, когда перед нажатием данной кнопки был выделено слово сформирован
. Листинг 2.3.
Вставка гиперссылки <body>
Этот файл создан для примера. Если нужно, будет <a href='http://'>сформирован</a> еще один такой файл.
</body>
В сформированном коде остается лишь ввести вручную адрес гиперссылки, являющийся значением атрибута
href
. Чтобы вставить в документ изображение, нужно нажать на вкладке
Специальные
кнопку Вставить картинку
, предварительно поместив курсор в то место программного кода, где должна находиться картинка. При нажатии кнопки на экране отображается окно, в котором нужно указать путь к файлу изображения. В листинге 2.4 показан фрагмент кода со вставкой изображения из файла Образец.html
. Листинг 2.4.
Вставка изображения <body>
Этот файл создан для примера.
<img src='/picture/Образец.jpg'>
Если нужно, будет сформирован еще один такой файл.
</body>
Кнопка
Вставить пробел
предназначена для вставки пробела. Дело в том, что в языке HTML существует следующая особенность: сколько бы раз вы ни нажимали клавишу Пробел
, он будет распознавать это как один пробел. Иначе говоря, увеличить расстояние между словами путем многократного нажатия клавиши Пробел
у вас не получится: оно все равно будет равняться одному пробелу. Для решения этой проблемы в языке HTML предназначен специальный инструмент
