Реферат: Форматирование текста в Microsoft Word 2:. Форматирование текста для реферата

Форматирование текста. Реферат, курсовая, диплом на компьютере

Форматирование текста

Текст в редакторе Word можно набирать разными шрифтами. Программа предусматривает установку размера, типа и начертания шрифта. Перед форматированием необходимо выделить фрагмент текста, который требуется изменить.

Выделить текст можно несколькими способами. Наиболее простой – выделение с помощью мыши. Для этого, удерживая нажатой левую кнопку мыши при I-образном указателе, выделите необходимый фрагмент. Если же вы предпочитаете работать с клавиатурой, выделить текст можно, удерживая Shift и перемещая клавиши управления курсором.

Примечание

В редакторе Word существует специальный режим – режим выделения текста. Чтобы перейти в этот режим, нужно нажать клавишу F8. Теперь текст можно выделять стрелками или клавишами Page Up/Page Down (Shift при этом нажимать не нужно). Если ввести любую букву или знак препинания, будет выделен весь текст до этой буквы. Аналогично можно нажимать Пробел, чтобы выделить следующее слово (до этого пробела), клавишу Enter, чтобы выделить абзац до конца. Несколько нажатий клавиши F8 вызывают выделение сначала слова, затем предложения, абзаца и, наконец, всего текста. Чтобы выделить предложение, требуется нажать F8 три раза. Для выхода из режима выделения следует нажать Esc.

В редакторе Word текст можно сделать полужирным, курсивным или подчеркнутым. Эти параметры можно изменить на панели инструментов Форматирование, для этого предназначены кнопки с изображением букв «ж», «к» и «ч». Кроме того, вы можете задать другой размер и тип шрифта – на этой же панели инструментов размещены поля для настройки этих параметров. Все эти возможности, а также ряд других доступны в диалоговом окне Шрифт, открыть которое можно, выбрав одноименный пункт меню Формат (рис. 2.6).

Рис. 2.6. В окне Шрифт доступны параметры работы со шрифтами

В списке Шрифт одноименного окна расположены инструменты, дублирующие назначения кнопок панели инструментов. Ниже размещены раскрывающиеся списки для изменения цвета текста и выбора типа его подчеркивания. Обратите внимание, что подчеркивание можно задать не только «классическое», обычной линией. Подчеркнуть текст можно волнистой, штриховой или штрихпунктирной линией. В этом же окне можно задать цвет шрифта и цвет подчеркивания.

Не менее интересна область Видоизменение. Здесь можно применить дополнительные эффекты к вашему тексту. Предназначение флажков зачеркнутый, двойное зачеркивание, контур, с тенью, приподнятый, утопленный очевидно. С их помощью можно придать иной внешний вид буквам. Гораздо интереснее другие переключатели. Например, надстрочный и подстрочный применяются для создания верхних и нижних индексов (именно так, кстати, они и назывались в предыдущих версиях Microsoft Word). Например, вам необходимо набрать несложную формулу, нечто вроде х2+ 6. Для такой мелочи открывать редактор формул (который может быть и не установлен на компьютере) просто смешно, а вот шрифт типа Надстрочный здесь как раз и пригодится. Наберите х2 + 6 и для цифры «2» установите этот эффект – формула готова.

Довольно интересным эффектом для выделения в редакторе Word является использование разреженного текста. В результате применения этого эффекта расстояние между буквами увеличится. Таким образом, отформатированный фрагмент будет бросаться в глаза. Для изменения этого параметра перейдите на вкладку Интервал и выберите эффект Разреженный. Здесь же вы можете установить величину разрежения. Эффекты анимации доступны на третьей вкладке окна Шрифт. Мерцание или Красные муравьи – все это можно применить к вашему тексту.

Следующая глава >

it.wikireading.ru

Реферат - Форматирование текста - Информатика

В этом разделе описаны элементы для оформления и смыслового выделения текста — подчеркивания, изменения шрифта, выделения курсивом, цитирования и т.д.

Элементы форматирования текста:

TITLE

(HTML 2.0) — Title Определяет имя всего документа. Имя, как правило, отображается в заголовке окна браузера. Данный элемент обязателен для любого HTML-документа и может быть указан не более одного раза.

TR

(HTML 3.2) — Table Row Создает новый ряд (строку) ячеек таблицы. Ячейки в ряду создаются с помощью элементов TD и TH

Параметры:

ALIGN — определяет способ горизонтального выравнивания содержимого всех ячеек данного ряда. Возможные значения: left, center, right.

VALIGN — определяет способ вертикального выравнивания содержимого всех ячеек данного ряда. Возможные значения: top, bottom, middle.

BGCOLOR — определяет цвет фона для всех ячеек данного ряда. Задается либо RGB-значением в шестнадцатиричной системе, либо одним из 16 базовых цветов.

TT

(HTML 2.0) — Tele Type Данный элемент отображает помещенный между начальным и конечным тэгами текст моноширинным шрифтом.

U

(HTML 2.0) — Underline Данный элемент отображает помещенный между начальным и конечным тэгами текст как подчеркнутый.

UL

(HTML 2.0) — Unsorted List Создает неупорядоченный список. Между начальным и конечным тэгами должны присутствовать один или несколько элементов LI, обозначающих отдельные пункты списка.

VAR

(HTML 2.0) — Variable Элемент VAR предназначен для обозначения в тексте переменных. Как правило, отображается курсивом.

Основные метки

Теперь поясню, что же значат это метки

<html>… </html>

Эти метки являются первым и последним тэгом который вам придется написать при создании сайта. Метка <html> должна открывать HTML-документ. Аналогично, метка </html> должна завершать HTML-документ.

<head>… </head>

Эта пара меток указывает на начало и конец заголовка документа. Помимо наименования документа (см. описание метки <title> ниже), в этот раздел может включаться множество служебной информации, о которой мы обязательно поговорим чуть позже.

<title>… </title>

Все, что находится между метками <title> и </title>, толкуется браузером как название документа. Internet Explorer, например, показывает название текущего документа в заголовке окна и печатает его в левом верхнем углу каждой страницы при выводе на принтер. Рекомендуется название не длиннее 64 символов.

<body>… </body>

Эта пара меток указывает на начало и конец тела HTML-документа, каковое тело, собственно, и определяет содержание документа.

<h2>… </h2> — <H6>… </H6>

Метки вида <Hi> (где i — цифра от 1 до 6) описывают заголовки шести различных уровней. Заголовок первого уровня — самый крупный, шестого уровня, естественно — самый мелкий. Я не использую эти метки, скоро скажу почему...

<P>… </P>

Такая пара меток описывает абзац. Все, что заключено между <P> и </P>, воспринимается как один абзац.

Метки <Hi> и <P> могут содержать дополнительный атрибут ALIGN (читается «элайн», от английского «выравнивать»), например:

<h2 ALIGN=CENTER>Выравнивание заголовка

по центру</h2>

или

<P ALIGN=RIGHT>Образец абзаца с выравниванием

по правому краю</P>

Подытожим все, что мы знаем, с помощью примера 2:

<html>

<head>

<title>Пример 2</title>

</head>

<body>

<h2 ALIGN=CENTER>Привет!</h2>

<h3>Это чуть более сложный пример

HTML-документа</h3>

<P>Теперь мы знаем, что абзац можно выравнивать

не только влево, </P>

<P ALIGN=CENTER>но и по центру</P>

<P ALIGN=RIGHT>или по правому краю.</P>

</body>

</html>

С этого момента Вы знаете достаточно, чтобы создавать простые HTML-документы самостоятельно от начала до конца. В следующем разделе мы поговорим, как можно улучшить наш простой HTML-документ. Начнем с малого — с абзаца.

Непарные метки

В этом разделе мы поговорим о метках, которые не подчиняются двум основным правилам HTML: все они непарные, а некоторые (так называемые &-последовательности) к тому же должны вводиться только маленькими буквами.

<BR>

Эта метка используется, если необходимо перейти на новую строку, не прерывая абзаца.

Очень удобно при публикации стихов (см. пример 3).

<html>

<head>

<title>Пример 3</title>

</head>

<body>

<h2>Стих</h2>

<h3>Автор неизвестен</h3>

<P>Однажды в студеную зимнюю пору<BR>

Сижу за решеткой в темнице сырой.<BR>

Гляжу — поднимается медленно в гору<BR>

Вскормленный в неволе орел молодой.</P>

<P>И шествуя важно, в спокойствии чинном,<BR>

Мой грустный товарищ, махая крылом,<BR>

В больших сапогах, в полушубке овчинном,<BR>

Кровавую пищу клюет под окном.</P>

</body> </html>

<HR>

Метка <HR> описывает вот такую горизонтальную линию:

--------------------------------------------------------------------------------

Метка может дополнительно включать атрибуты SIZE (определяет толщину линии в пикселах) и/или WIDTH (определяет размах линии в процентах от ширины экрана). В примере 4 приведена небольшая коллекция горизонтальных линий.

Тут можно определить её расположение относительно боков экрана, вставив в эту метку команду align=«center», где center значит по центру, но можно еще left — по левому краю, right — по правому. Вот, например, линия:

<HR align=«center» WIDTH=200 size=6> — в длину 200 пикселей, по центру экрана и шириной 6 выглядит:

--------------------------------------------------------------------------------

Также с помощью команты color можно определить цвет линии. Сделаем эту линию синего цвета <HR align=«center» WIDTH=200 size=6 color=0000ff>

--------------------------------------------------------------------------------

<html>

<head>

<title>Пример 4</title>

</head>

<body>

<h2>Коллекция горизонтальных линий</h2>

<HR SIZE=2 WIDTH=100%><BR>

<HR SIZE=4 WIDTH=50%><BR>

<HR SIZE=8 WIDTH=25%><BR>

<HR SIZE=16 WIDTH=12%><BR>

</body>

</html>

&-последовательности

Поскольку символы "<" и ">" воспринимаются браузерами как начало и конец HTML-меток, возникает вопрос: а как показать эти символы на экране? В HTML это делается с помощью &-последовательностей (их еще называют символьными объектами или эскейп-последовательностями). Браузер показывает на экране символ "<", когда встречает в тексте последовательность < (по первым буквам английских слов less than — меньше, чем). Знак ">" кодируется последовательностью > (по первым буквам английских слов greater than — больше, чем).

Символ "&" (амперсанд) кодируется последовательностью &

Двойные кавычки (") кодируются последовательностью "

Помните: точка с запятой — обязательный элемент &-последовательности. Кроме того, все буквы, составляющие последовательность, должны быть в нижнем регистре (т.е., маленькие). Использование меток типа &QUOT; или &AMP; не допускается.

Вообще говоря, &-последовательности определены для всех символов из второй половины ASCII-таблицы (куда, естественно, входят и русские буквы). Дело в том, что некоторые серверы не поддерживают восьмибитную передачу данных, и поэтому могут передавать символы с ASCII-кодами выше 127 только в виде &-последовательностей.

Комментарии

Браузеры игнорируют любой текст, помещенный между <!-- и -->. Это удобно для размещения комментариев.

<!-- Это комментарий -->

Форматирование шрифта

HTML допускает два подхода к шрифтовому выделению фрагментов текста. С одной стороны, можно прямо указать, что шрифт на некотором участке текста должен быть жирным или наклонным, то есть изменить физический стиль текста. С другой стороны, можно пометить некоторый фрагмент текста как имеющий некоторый отличный от нормального логический стиль, оставив интерпретацию этого стиля браузеру. Поясним это на примерах.

Физические стили

Под физическом стилем принято понимать прямое указание браузеру на модификацию текущего шрифта. Например, все, что находится между метками <B> и </B>, будет написано жирным шрифтом. Текст между метками <I> и </I> будет написан наклонным шрифтом.

Несколько особняком стоит пара меток <TT> и </TT>. Текст, размещенный между этими метками, будет написан шрифтом, имитирующим пишущую машинку, то есть имеющим фиксированную ширину символа.

Логические стили

При использовании логических стилей автор документа не может знать заранее, что увидит на экране читатель. Разные браузеры толкуют одни и те же метки логических стилей по-разному. Некоторые браузеры игнорируют некоторые метки вообще и показывают нормальный текст вместо выделенного логическим стилем. Вот самые распространенные логические стили.

<EM>… </EM>

От английского emphasis — акцент.

<STRONG>… </STRONG>

От английского strong emphasis — сильный акцент.

<CODE>… </CODE>

Рекомендуется использовать для фрагментов исходных текстов.

<SAMP>… </SAMP>

От английского sample — образец. Рекомендуется использовать для демонстрации образцов сообщений, выводимых на экран программами.

<KBD>… </KBD>

От английского keyboard — клавиатура. Рекомендуется использовать для указания того, что нужно ввести с клавиатуры.

<VAR>… </VAR>

От английского variable — переменная. Рекомендуется использовать для написания имен переменных.

Пример

Подытожим наши знания о логических и физических стилях с помощью примера 5. Заодно Вы сможете увидеть, как Ваш браузер показывает те или иные логические стили.

<html>

<head>

<title>Пример 5</title>

</head>

<body>

<h2>Шрифтовое выделение фрагментов текста</h2>

<P>Теперь мы знаем, что фрагменты текста можно

выделять

<B>жирным</B> или <I>наклонным</I> шрифтом.

Кроме того, можно

включать в текст фрагменты с фиксированной шириной

символа

<TT>(имитация пишущей машинки)</TT></P>

<P>Кроме того, существует ряд логических стилей:</P>

<P><EM>EM — от английского emphasis — акцент </EM><BR>

<STRONG>STRONG — от английского strong emphasis -

сильный акцент </STRONG><BR>

<CODE>CODE — для фрагментов

исходных текстов</CODE><BR>

<SAMP>SAMP — от английского sample -

образец </SAMP><BR>

<KBD>KBD — от английского keyboard -

клавиатура</KBD><BR>

<VAR>VAR — от английского variable -

переменная </VAR></P>

</body>

</html>

Ненумерованные списки

HTML позволяет определять внешний вид целых абзацев текста. Абзацы можно организовывать в списки, выводить их на экран в отформатированном виде, или увеличивать левое поле. Разберем все по порядку.

Ненумерованные списки: <UL>… </UL>

Текст, расположенный между метками <UL> и </UL>, воспринимается как ненумерованный список. Каждый новый элемент списка следует начинать с метки <LI>. Например, чтобы создать вот такой список:

Иван;

Данила;

белая кобыла

необходим вот такой HTML-текст:

<UL>

<LI>Иван;

<LI>Данила;

<LI>белая кобыла

</UL>

Обратите внимание: у метки <LI> нет парной закрывающей метки.

Нумерованные списки

Нумерованные списки устроены точно так же, как ненумерованные, только вместо символов, выделяющих новый элемент, используются цифры. Если слегка модифицировать наш предыдущий пример:

<OL>

<LI>Иван;

<LI>Данила;

<LI>белая кобыла

</OL>

получится вот такой список:

Иван;

Данила;

белая кобыла

Списки определений: <DL>… </DL>

Список определений несколько отличается от других видов списков. Вместо меток <LI> в списках определений используются метки <DT> (от английского definition term — определяемый термин) и <DD> (от английского definition definition — определение определения). Разберем это на примере. Допустим, у нас имеется следующий фрагмент HTML-текста:

<DL>

<DT>HTML

<DD>Термин HTML (HyperText Markup Language) означает

'язык маркировки гипертекстов'. Первую версию HTML

разработал сотрудник Европейской лаборатории физики

элементарных частиц Тим Бернерс-Ли.

<DT>HTML-документ

<DD>Текстовый файл с расширением *.html

(Unix-системы могут содержать файлы

с расширением *.htmll).

</DL>

Этот фрагмент будет выведен на экран следующим образом:

HTML

Термин HTML (HyperText Markup Language) означает 'язык маркировки гипертекстов'. Первую версию HTML разработал сотрудник Европейской лаборатории физики элементарных частиц Тим Бернерс-Ли.

HTML-документ

Текстовый файл с расширением *.html (Unix-системы могут содержать файлы с расширением *.htmll).

Обратите внимание: точно так же, как метки <LI>, метки <DT> и <DD> не имеют парных закрывающих меток.

Если определяемые термины достаточно коротки, можно использовать модифицированную открывающую метку <DL COMPACT>. Например, вот такой фрагмент HTML-текста:

<DL COMPACT>

<DT>А

<DD>Первая буква алфавита

<DT>Б

<DD>Вторая буква алфавита

<DT>В

<DD>Третья буква алфавита

</DL>

будет выведен на экран примерно так:

А

Первая буква алфавита

Б

Вторая буква алфавита

В

Третья буква алфавита

Вложенные списки

Элемент любого списка может содержать в себе целый список любого вида. Число уровней вложенности в принципе не ограничено, однако злоупотреблять вложенными списками все же не следует.

Вложенные списки очень удобны при подготовке разного рода планов и оглавлений.

Наши знания о списках можно вкратце свести в пример 6:

<html>

<head>

<title>Пример 6</title>

</head>

<body>

<h2>HTML поддерживает несколько видов списков </h2>

<DL>

<DT>Ненумерованные списки

<DD>Элементы ненумерованного списка выделяются

специальным

символом и отступом слева:

<UL>

<LI>Элемент 1

<LI>Элемент 2

<LI>Элемент 3

</UL>

<DT>Нумерованные списки

<DD>Элементы нумерованного списка выделяются

отступом слева, а

также нумерацией:

<OL>

<LI>Элемент 1

<LI>Элемент 2

<LI>Элемент 3

</OL>

<DT>Списки определений

<DD>Этот вид списков чуть сложнее, чем два предыдущих,

но и выглядит более эффектно.

<P>Помните, что списки можно встраивать один в другой,

но не

следует закладывать слишком много уровней вложенности.

</P>

<P>Обратите внимание, что внутри элемента списка

может находиться

несколько абзацев. Все абзацы при этом будут иметь

одинаковое левое поле. </P>

</DL>

</body>

</html>

Форматированный текст: <PRE>… </PRE>

В самом начале мы говорили о том, что браузеры игнорируют множественные пробелы и символы конца строки. Из этого правила, однако, есть исключение.

Текст, заключенный между метками <PRE> и </PRE> (от английского preformatted — предварительно форматированный), выводится браузером на экран как есть — со всеми пробелами, символами табуляции и конца строки. Это очень удобно при создании простых таблиц.

Текст с отступом: <BLOCKQUOTE>… </BLOCKQUOTE>

Текст, заключенный между метками <BLOCKQUOTE> и </BLOCKQUOTE>, выводится браузером на экран с увеличенным левым полем.

Связывание

Как уже упоминалось в самом начале, сокращение HTML означает «язык маркировки гипертекстов». Про маркировку мы уже поговорили достаточно. Не пора ли перейти к гипертексту?

Прежде всего, что же такое гипертекст? В отличие от обыкновенного текста, который можно читать только от начала к концу, гипертекст позволяет осуществлять мгновенный переход от одного фрагмента текста к другому. Системы помощи многих популярных программных продуктов устроены именно по гипертекстовому принципу. При нажатии левой кнопкой мыши на некоторый выделенный фрагмент текущего документа происходит переход к некоторому заранее назначенному документу или фрагменту документа.

В HTML переход от одного фрагмента текста к другому задается с помощью метки вида:

<A HREF=«адрес перехода»>

здесь впишите текст, который будет гипер</A>

В качестве параметра [адрес перехода] может использоваться несколько типов аргументов. Самое простое — это задать имя другого HTML-документа, к которому нужно перейти. Например:

<A HREF=«index.html»>Перейти к оглавлению</A>

Такой фрагмент HTML-текста приведет к появлению в документе выделенного фрагмента Перейти к оглавлению, при нажатии на который в текущее окно будет загружен документ spravka.html.

Обратите внимание: если в адресе перехода не указан каталог, переход будет выполнен внутри текущего каталога. Если в адресе перехода не указан сервер, переход будет выполнен на текущем сервере.

Из этого следует одно очень важное практическое соображение. Если Вы подготовили к публикации некоторую группу HTML-документов, которые ссылаются друг на друга только по имени файла и находятся в одном каталоге на Вашем компьютере, вся эта группа документов будет работать точно так же, если ее поместить в любой другой каталог на любом другом компьютере, на локальной сети или… на Интернет! Таким образом, у Вас появляется возможность разрабатывать целые коллекции документов без подключения к Интернет, и только после окончательной готовности, подтвержденной испытаниями, помещать коллекции документов на Интернет целиком.

На практике, однако, часто бывает необходимо дать ссылку на документ, находящийся на другом сервере. Например, если Вы хотите дать ссылку на это руководство со своей странички, Вам придется ввести в свой HTML-документ примерно такой фрагмент:

<A HREF=«www.neive.by.ru/index.html»>

Практическое руководство по HTML Мысина Анатолия</A>

При необходимости можно задать переход не просто к некоторому документу, но и к определенному месту внутри этого документа. Для этого необходимо создать в документе, к которому будет задан переход, некоторую опорную точку, или анкер. Разберем это на примере.

Допустим, что необходимо осуществить переход из файла 1.html к словам «Переход закончен» в файле 2.html (файлы находятся в одном каталоге). Прежде всего, необходимо создать вот такой анкер в файле 2.html:

<A NAME=«AAA»>Переход закончен</A>

Слова «Переход закончен» при этом никак не будут выделены в тексте документа.

Затем в файле 1.html (или в любом другом) можно определить переход на этот анкер:

<A HREF=«2.html#AAA»>Переход к анкеру AAA</A>

Кстати говоря, переход к этому анкеру можно определить и внутри самого документа 2.html — достаточно только включить в него вот такой фрагмент:

<A HREF="#AAA">Переход к анкеру AAA</A>

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

Во избежание недоразумений рекомендуется задавать имена анкеров латинскими буквами. Следите за написанием имен анкеров: большинство браузеров отличают большие буквы от маленьких. Если имя анкера определено как AAA, ссылка на анкер aaa или AaA не выведет Вас на анкер AAA, хотя документ, скорее всего, будет загружен корректно.

Пока что мы обсуждали только ссылки на HTML-документы. Однако возможны ссылки и на другие виды ресурсов:

<A HREF=«ftp://server/directory/file.ext»>

Выгрузить файл</A>

Такая ссылка, если ей воспользоваться, запустит протокол передачи файлов и начнет выгрузку файла file.ext, находящегося в каталоге directory на сервере server, на локальный диск пользователя.

<A HREF=«mailto:[email protected]»>Послать письмо</A>

Если пользователь совершит переход по такой ссылке, у него на экране откроется окно ввода исходящего сообщения его почтовой программы. В строке To: («Куда») окна почтовой программы будет указано [email protected].

Разберем все, что мы знаем о связывании, с помощью примера 7.

<HTML>

<HEAD>

<TITLE>Пример 7</TITLE>

</HEAD>

<BODY>

<h2>Связывание </h2>

<P>С помощью ссылок можно переходить к другим файлам

(например, к <A HREF=«index.html»>оглавлению этого

руководства</A>).</P>

<P>Можно выгружать файлы (например,

<A HREF=«ftp://yi.com/home/ChuvakhinNikolai/

html-pr.doc»>это руководство в формате Microsoft

Word 2.0</A>) по FTP.</P>

<P>Можно дать пользователю возможность послать почту

(например, <A HREF=«mailto:[email protected]»>

автору этого руководства</A>).</P>

</BODY>

</HTML>

Изображения в HTML-документе

Встроить изображение в HTML-документ очень просто. Для этого нужно только иметь это самое изображение в формате GIF (файл с расширением *.gif) или JPEG (файл с расширением *.jpg или *.jpeg) и одну строчку в HTML-тексте.

Допустим, нам нужно включить в документ изображение, записанное в файл picture.gif, находящийся в одном каталоге с HTML-документом. Тогда строчка будет вот такая:

<IMG SRC=«picture.gif»>

Метка <IMG SRC="[имя файла]"> может также включать атрибут ALT="[текст]", например:

<IMG SRC=«picture.gif» ALT=«Картинка»>

Встретив такую метку, браузер покажет на экране текст Картинка и начнет загружать на его место картинку из файла picture.gif. Атрибут ALT может оказаться необходимым для старых браузеров, которые не поддерживают изображений, а также на случай, если у браузера отключена автоматическая загрузка изображений (при медленном подключении к Интернет это делается для экономии времени).

Файл, содержаций изображение, может находиться в другом каталоге или даже на другом сервере. В этом случае стоит указать его полное имя (см. раздел «Связывание»).

Разберем все, что мы знаем об изображениях, с помощью примера 8.

<HTML>

<HEAD>

<TITLE>Пример 8</TITLE>

</HEAD>

<BODY>

<h2>Изображения </h2>

<P>Изображение можно встроить очень просто: </P>

<P><IMG SRC=«picture.gif»></P>

<P>Кроме того, изображение можно сделать «горячим»,

то есть осуществлять переход при нажатии на

изображение:</P>

<P><A HREF=«index.html»><IMG SRC=«picture.gif»>

</A></P>

</BODY>

</HTML>

Обратите внимание на вторую часть примера. Если ссылка на изображение находится между метками <A HREF="..."> и </A>, изображение фактически становится кнопкой, при нажатии на которую происходит переход по ссылке (в примере 8 переход происходит на оглавление Руководства).

Цветовая гамма HTML-документа

Если Вы читаете это Руководство на Интернет, Вы уже могли заметить, что главы Руководства и примеры несколько отличаются по цветовой гамме. Главы Руководства написаны черным по белому, а гипертекстовые ссылки выделены красным цветом. Я не знаю, как Вы видите примеры, но у меня они написаны черным по серому с выделением ссылок синим цветом.

Дело в том, что главы Руководства содержат HTML-метки, определяющие их цветовую гамму. Примеры таких меток не содержат, поэтому их цветовая гамма устанавливается браузером самостоятельно. Именно поэтому я не знаю, какие цвета Вы видите в примерах — это определяется настройкой Вашего браузера.

Цветовая гамма HTML-документа определяется атрибутами, размещенными внутри метки <BODY>. Вот список этих атрибутов:

bgcolor

Определяет цвет фона документа.

text

Определяет цвет текста документа.

link

Определяет цвет выделенного элемента текста, при нажатии на который происходит переход по гипертекстовой ссылке.

vlink

Определяет цвет ссылки на документ, который уже был просмотрен ранее.

alink

Определяет цвет ссылки в момент, когда на нее указывает курсор мыши и нажата ее правая кнопка, то есть непосредственно перед переходом по ссылке.

Цвет кодируется последовательностью из трех пар символов. Каждая пара представляет собой шестнадцатиричное значение насыщенности заданного цвета одним из трех основных цветов (красным, зеленым и синим) в диапазоне от нуля (00) до 255 (FF). Разберем несколько примеров.

bgcolor=#FFFFFF

Цвет фона. Насыщенность красным, зеленым и синим одинакова — FF (это шестнадцатиричное представление числа 255). Результат — белый цвет.

text=#000000

Цвет текста. Насыщенность красным, зеленым и синим одинакова — 00 (ноль). Результат — черный цвет.

link=#FF0000

Цвет гипертекстовой ссылки. Насыщенность красным — FF (255), зеленым и синим — 00 (ноль). Результат — красный цвет.

Кроме того, метка <BODY> может включать атрибут background="[имя файла]", который задает изображение, служащее фоном для текста и других изображений. Как и любое другое изображение, фон должен быть представлен в формате GIF (файл с расширением *.gif) или JPEG (файл с расширением *.jpg или *.jpeg).

Браузеры заполняют множественными копиями изображения-фона все пространство окна, в котором открыт документ, подобно тому, как при строительстве большие пространства стен покрывают маленькими (и одинаковыми) плитками.

Важно отметить, что цвет фона и изображение-фон никак не отображаются на бумаге при выводе HTML-документа на печать. Из этого есть одно важное практическое следствие: старайтесь не использовать текст белого цвета.

Заголовок HTML-документа

Заголовок HTML-документа, вообще говоря, не виден пользователю при просмотре. Однако в нем есть некоторые интересные особенности, которые стоит знать.

Заголовок HTML-документа может включать неограниченное количество так называемых META-инструкций. META-инструкция — это просто способ определить некоторую переменную путем указания ее имени (атрибут NAME) и значения (атрибут CONTENT). Вот некоторые наиболее типичные META-инструкции:

<META NAME=«description» CONTENT=«Это руководство -

учебник для тех, кто хочет публиковать документацию

любого рода на глобальной компьютерной сети

Интернет»>

Такая META-инструкция определяет переменную description, содержащую краткое описание документа. Многие поисковые механизмы постоянно сканируют Интернет в поисках HTML-файлов, отыскивают в них эту переменную, сохраняют ее в своих базах данных и демонстрируют ее в ответ на запросы пользователей.

<META NAME=«keywords» CONTENT=«Интернет, HTML, WWW,

руководство, публикация, гипертекст»>

Такая META-инструкция определяет переменную keywords, содержащую набор ключевых слов, описывающих содержание документа. На практике поиск по кл похоже, что именно такой подход был использован, например, при создании сервера технической поддержки фирмы Novell, ведущего производителя операционных систем для локальных компьютерных сетей).

Другая группа META-инструкций определяет эквиваленты команд протокола передачи гипертекстов. (Не переживайте, это не так страшно, как кажется на первый взгляд!) Разберем несколько примеров:

<META HTTP-EQUIV=«Content-type»

CONTENT=«text/html; charset=windows-1251»>

Эта META-инструкция дает браузеру указание интерпретировать загружаемый документ как содержащий HTML-текст в кодировке Windows/1251.

<META HTTP-EQUIV=«Content-type»

CONTENT=«text/html; charset=koi8-r»>

Эта META-инструкция абсолютно аналогична предыдущей, только в качестве кодировки указана КОИ-8.

<META HTTP-EQUIV=«Refresh» CONTENT="[время];

URL=[документ]">

Такая META-инструкция дает браузеру примерно такое указание: «Если через [время] секунд после завершения загрузки этого документа пользователь не перейдет к другому документу, начать загрузку ресурса [документ]». Более конкретно это может выглядеть, к примеру, вот так:

<META HTTP-EQUIV=«Refresh»

CONTENT=«10; URL=http://www.yi.com/home/

ChuvakhinNikolai/»>

Если пользователь не предпримет никаких видимых действий в течение 10 секунд после загрузки документа, содержащего такую инструкцию, автоматически будет загружен документ www.yi.com/home/ChuvakhinNikolai/.

META-инструкцию Refresh можно использовать, например, если Вы перенесли некоторый документ с одного сервера на другой. Вместо копии документа на старом сервере можно оставить короткое сообщение о переносе, включающее META-инструкцию Refresh и адрес документа на новом сервере.

Если в качестве параметра [документ] подставить имя файла, содержащего звук, через [время] секунд после загрузки HTML-файла начнется загрузка и проигрывание этого звука (при условии, конечно, что браузер пользователя поддерживает формат этого звукового файла). Очень удобно для всякого рода приветственных речей. Пример В отличие от всех примеров, которые мы рассматривали ранее, пример 9 состоит не из одного, а из трех файлов. Используя META-инструкцию Refresh, мы создадим небольшой слайд-фильм из трех кадров (файлов primer9.html, primer9a.html и eprimer9b.html), которые будут циклически повторяться. Для остановки демонстрации нужно будет воспользоваться любой из гипертекстовых ссылок.

<HTML><!--файл primer9.html -->

<HEAD>

<TITLE>Пример 9</TITLE>

<META HTTP-EQUIV=«Refresh» CONTENT=«2;

URL=primer9a.html»>

</HEAD>

<BODY bgcolor=#FFFFFF text=#000000 link=#FF0000>

<h2>Слайд-демонстрация цветовых гамм <BR>

с помощью META-инструкции Refresh </h2>

<P>Черный текст на белом фоне </P>

<P>[<A HREF=«spravka.html»>Возврат к оглавлению</A>|

<A HREF=«glava6.html»>Возврат к главе 6</A>]</P>

</BODY>

</HTML><!--конец файла primer9.html -->

<HTML><!--файл primer9a.html -->

<HEAD>

<TITLE>Пример 9a</TITLE>

<META HTTP-EQUIV=«Refresh» CONTENT=«2;

URL=primerb.html»>

</HEAD>

<BODY bgcolor=#000000 text=#FFFFFF link=#FF0000>

<h2>Слайд-демонстрация цветовых гамм <BR>

с помощью META-инструкции Refresh </h2>

<P>Белый текст на черном фоне </P>

<P>[<A HREF=«spravka.html»>Возврат к оглавлению</A>|

<A HREF=«glava6.html»>Возврат к главе 6</A>]</P>

</BODY>

</HTML><!--конец файла primer9a.html -->

<HTML><!--файл primer9b.html -->

<HEAD>

<TITLE>Пример 9b</TITLE>

<META HTTP-EQUIV=«Refresh» CONTENT=«2;

URL=primer9.html»>

</HEAD>

<BODY bgcolor=#C0C0C0 text=#0000FF link=#FF0000>

<h2>Слайд-демонстрация цветовых гамм <BR>

с помощью META-инструкции Refresh </h2>

<P>Синий текст на сером фоне </P>

<P>[<A HREF=«index.html»>Возврат к оглавлению</A>|

<A HREF=«glava6.html»>Возврат к главе 6</A>]</P>

</BODY>

</HTML><!--конец файла primer9b.html -->

Для чего нужны таблицы?

На этот вопрос есть очевидный ответ: таблицы нужны для представления информации в табличном виде. Есть, однако, и менее очевидные ответы.

До настоящего времени мы имели дело с документами, в которых существовал только один «поток» текста. На практике иногда очень хочется расположить текст в несколько колонок. Таблица может в этом помочь.

Кроме того, таблица, состоящая из одной ячейки, может очень эффектно выделить фрагмент текста, на который Вы хотите обратить внимание читателя.

Как устроена Таблица?

В устройстве таблицы легче всего разобраться на простом примере.

й

<HTML>

<HEAD>

<TITLE>Пример 10</TITLE>

</HEAD>

<h2>Простейшая таблица </h2>

<TABLE BORDER=1> <!--Это начало таблицы-->

<CAPTION> <!--Это заголовок таблицы-->

У таблицы может быть заголовок

</CAPTION>

<TR> <!--Это начало первой строки-->

<TD> <!--Это начало первой ячейки-->

Первая строка, первая колонка

</TD> <!--Это конец первой ячейки-->

<TD> <!--Это начало второй ячейки-->

Первая строка, вторая колонка

</TD> <!--Это конец второй ячейки-->

</TR> <!--Это конец первой строки-->

<TR> <!--Это начало второй строки-->

<TD> <!--Это начало первой ячейки-->

Вторая строка, первая колонка

</TD> <!--Это конец первой ячейки-->

<TD> <!--Это начало второй ячейки-->

Вторая строка, вторая колонка

</TD> <!--Это конец второй ячейки-->

</TR> <!--Это конец второй строки-->

</TABLE> <!--Это конец таблицы-->

</BODY>

</HTML>

Таблица начинается с метки <TABLE> и заканчивается меткой </TABLE>. Метка <TABLE> может включать несколько атрибутов:

ALIGN

Устанавливает расположение таблицы по отношению к полям документа. Допустимые значения: ALIGN=LEFT (выравнивание влево), ALIGN=CENTER (выравнивание по центру), ALIGN=RIGHT (выравнивание вправо).

WIDTH

Ширина таблицы. Ее можно задать в пикселах (например, WIDTH=400) или в процентах от ширины страницы (например, WIDTH=80%).

BORDER

Устанавливает ширину внешней рамки таблицы и ячеек в пикселах (например, BORDER=4). Если атрибут не установлен, таблица показывается без рамки. Можно задать цвет рамки тэгом BORDERCOLOR

CELLSPACING

Устанавливает расстояние между рамками ячеек таблицы в пикселах (например, CELLSPACING=2).

CELLPADDING

Устанавливает расстояние между рамкой ячейки и текстом в пикселах (например, CELLPADDING=10).

Таблица может иметь заголовок (<CAPTION>… </CAPTION>), хотя заголовок не является обязательным. Метка <CAPTION> может включать атрибут ALIGN. Допустимые значения: <CAPTION ALIGN=TOP> (заголовок помещается над таблицей) и <CAPTION ALIGN=BOTTOM> (заголовок помещается под таблицей).

Каждая строка таблицы начинается с метки <TR> и заканчивается меткой </TR>. Метка <TR> может включать следующие атрибуты:

ALIGN

Устанавливает выравнивание текста в ячейках строки. Допустимые значения: ALIGN=LEFT (выравнивание влево), ALIGN=CENTER (выравнивание по центру), ALIGN=RIGHT (выравнивание вправо).

VALIGN

Устанавливает вертикальное выравнивание текста в ячейках строки. Допустимые значения: VALIGN=TOP (выравнивание по верхнему краю), VALIGN=MIDDLE (выравнивание по центру), VALIGN=BOTTOM (выравнивание по нижнему краю).

Каждая ячейка таблицы начинается с метки <TD> и заканчивается меткой </TD>. Метка <TD> может включать следующие атрибуты:

NOWRAP

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

COLSPAN

Устанавливает «размах» ячейки по горизонтали. Например, COLSPAN=3 означает, что ячейка простирается на три колонки.

ROWSPAN

Устанавливает «размах» ячейки по вертикали. Например, ROWSPAN=2 означает, что ячейка занимает две строки.

ALIGN

Устанавливает выравнивание текста в ячейке. Допустимые значения: ALIGN=LEFT (выравнивание влево), ALIGN=CENTER (выравнивание по центру), ALIGN=RIGHT (выравнивание вправо).

VALIGN

Устанавливает вертикальное выравнивание текста в ячейке. Допустимые значения: VALIGN=TOP (выравнивание по верхнему краю), VALIGN=MIDDLE (выравнивание по центру), VALIGN=BOTTOM (выравнивание по нижнему краю).

WIDTH

Устанавливает ширину ячейки в пикселах (например, WIDTH=200).

HEIGHT

Устанавливает высоту ячейки в пикселах (например, HEIGHT=40).

Если ячейка таблицы пуста, вокруг нее не рисуется рамка. Если ячейка пуста, а рамка нужна, в ячейку можно ввести символьный объект   (non-breaking space — неразрывающий пробел). Ячейка по-прежнему будет пустой, а рамка вокруг нее будет.

Любопытно отметить, что любая ячейка таблицы может содержать в себе другую таблицу.

Для чего нужны формы?

Форма — это инструмент, с помощью которого HTML-документ может послать некоторую информацию в некоторую заранее определенную точку внешнего мира, где информация будет некоторым образом обработана.

Рассказать о формах в книге, посвященной HTML, достаточно трудно. Причина очень простая: создать форму гораздо проще, чем ту «точку внешнего мира», в которую форма будет посылать информацию. В качестве такой «точки» в большинстве случаев выступает программа, написанная на Перл или Си. Программы, обрабатывающие данные, переданные формами, часто называют CGI-скриптами. Сокращение CGI (Common Gateways Interface) означает «общепринятый интерфейс шлюзов». Написание CGI-скриптов в большинстве случаев требует хорошего знания соответствующего языка программирования и возможностей операционной системы Unix.

В последнее время определенное распространение получил язык PHP/FI, инструкции которого можно встраивать прямо в HTML-документы (документы при этом сохраняются в виде файлов с расширением *.pht или *.php).

Формы передают информацию программам-обработчикам в виде пар [имя переменной]=[значение переменной]. Имена переменных следует задавать латинскими буквами. Значения переменных воспринимаются обработчиками как строки, даже если они содержат только цифры.

Как устроена форма

Форма открывается меткой <FORM> и заканчивается меткой </FORM>. HTML-документ может содержать в себе несколько форм, однако формы не должны находиться одна внутри другой. HTML-текст, включая метки, может размещаться внутри форм без ограничений.

Метка <FORM> может содержать три атрибута, один из которых является обязательным. Вот эти атрибуты:

ACTION

Обязательный атрибут. Определяет, где находится обработчик формы.

METHOD

Определяет, каким образом (иначе говоря, с помощью какого метода протокола передачи гипертекстов) данные из формы будут переданы обработчику. Допустимые значения: METHOD=POST и METHOD=GET. Если значение атрибута не установлено, по умолчанию предполагается METHOD=GET.

ENCTYPE

Определяет, каким образом данные из формы будут закодированы для передачи обработчику. Если значение атрибута не установлено, по умолчанию предполагается ENCTYPE=application/x-www-form-urlencoded.

Простейшая форма

Для того, чтобы запустить процесс передачи данных из формы обработчику, нужен какой-то орган управления. Создать такой орган управления очень просто:

<INPUT TYPE=submit>

Встретив такую строчку внутри формы, браузер нарисует на экране кнопку с надписью Submit (читается «сабмит» с ударением на втором слоге, от английского «подавать»), при нажатии на которую все имеющиеся в форме данные будут переданы обработчику, определенному в метке <FORM>.

Надпись на кнопке можно задать такую, какая нравится, путем введения атрибута VALUE="[Надпись]" (читается «вэлью» с ударением на первом слоге, от английского «значение»), например:

<INPUT TYPE=submit VALUE=«Поехали!»>

Теперь мы знаем достаточно для того, чтобы написать простейшую форму (пример 11). Она не будет собирать никаких данных, а просто вернет нас к тексту этой главы.

<HTML>

<HEAD>

<TITLE>Пример 11</TITLE>

</HEAD>

<h2>Простейшая форма </h2>

<FORM ACTION=«glava8.html»> <!--Это начало формы-->

<INPUT TYPE=submit VALUE=«Назад, к главе 8...»>

</FORM> <!--Это конец формы-->

</BODY>

</HTML>

Надпись, нанесенную на кнопку, можно при необходимости передать обработчику путем введения в определение кнопки атрибута NAME=[имя] (читается «нэйм», от английского «имя»), например:

<INPUT TYPE=submit NAME=button VALUE=«Поехали!»>

При нажатии на такую кнопку обработчик вместе со всеми остальными данными получит и переменную button со значением Поехали!.

В форме может быть несколько кнопок типа submit с различными именами и/или значениями. Обработчик, таким образом, может действовать по-разному в зависимости от того, какую именно кнопку submit нажал пользователь.

Как форма собирает данные

Существуют и другие типы элементов <INPUT>. Каждый элемент <INPUT> должен включать атрибут NAME=[имя], определяющий имя элемента (и, соответственно, имя переменной, которая будет передана обработчику). Имя должно задаваться только латинскими буквами. Большинство элементов <INPUT> должны включать атрибут VALUE="[значение]", определяющий значение, которое будет передано обработчику под этим именем. Для элементов <INPUT TYPE=text> и <INPUT TYPE=password>, однако, этот атрибут не обязателен, поскольку значение соответствующей переменной может вводиться пользователем с клавиатуры.

Основные типы элементов <INPUT>:

TYPE=text

Определяет окно для ввода строки текста. Может содержать дополнительные атрибуты SIZE=[число] (ширина окна ввода в символах) и MAXLENGTH=[число] (максимально допустимая длина вводимой строки в символах). Пример:

<INPUT TYPE=text SIZE=20 NAME=user VALUE=«Иван»>

Определяет окно шириной 20 символов для ввода текста. По умолчанию в окне находится текст Иван, который пользователь может редактировать. Отредактированный (или неотредактированный) текст передается обработчику в переменной user.

TYPE=password

Определяет окно для ввода пароля. Абсолютно аналогичен типу text, только вместо символов вводимого текста показывает на экране звездочки (*). Пример:

<INPUT TYPE=password NAME=pw SIZE=20 MAXLENGTH=10>

Определяет окно шириной 20 символов для ввода пароля. Максимально допустимая длина пароля — 10 символов. Введенный пароль передается обработчику в переменной pw.

TYPE=radio

Определяет радиокнопку. Может содержать дополнительный атрибут checked (показывает, что кнопка помечена). В группе радиокнопок с одинаковыми именами может быть только одна помеченная радиокнопка. Пример:

<INPUT TYPE=radio NAME=modem VALUE=«9600» checked> 9600 бит/с

<INPUT TYPE=radio NAME=modem VALUE=«14400»> 14400 бит/с

<INPUT TYPE=radio NAME=modem VALUE=«28800»> 28800 бит/с

Определяет группу из трех радиокнопок, подписанных 9600 бит/с, 14400 бит/с и 28800 бит/с. Первоначально помечена первая из кнопок. Если пользователь не отметит другую кнопку, обработчику будет передана переменная modem со значением 9600. Если пользователь отметит другую кнопку, обработчику будет передана переменная modem со значением 14400 или 28800.

TYPE=checkbox

Определяет квадрат, в котором можно сделать пометку. Может содержать дополнительный атрибут checked (показывает, что квадрат помечен). В отличие от радиокнопок, в группе квадратов с одинаковыми именами может быть несколько помеченных квадратов. Пример:

<INPUT TYPE=checkbox NAME=comp VALUE=«PC»> Персональные компьютеры

<INPUT TYPE=checkbox NAME=comp VALUE=«WS» checked> Рабочие станции

<INPUT TYPE=checkbox NAME=comp VALUE=«LAN»> Серверы локальных сетей

<INPUT TYPE=checkbox NAME=comp VALUE=«IS» checked> Серверы Интернет

Определяет группу из четырех квадратов. Первоначально помечены второй и четвертый квадраты. Если пользователь не произведет изменений, обработчику будут переданы две переменные: comp=WS и comp=IS.

TYPE=hidden

Определяет скрытый элемент данных, который не виден пользователю при заполнении формы и передается обработчику без изменений. Такой элемент иногда полезно иметь в форме, которая время от времени подвергается переработке, чтобы обработчик мог знать, с какой версией формы он имеет дело. Другие возможные варианты использования Вы вполне можете придумать сами. Пример:

<INPUT TYPE=hidden NAME=version VALUE=«1.1»>

Определяет скрытую переменную version, которая передается обработчику со значением 1.1.

TYPE=reset

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

<INPUT TYPE=reset VALUE=«Очистить поля формы»>

Определяет кнопку Очистить поля формы, при нажатии на которую форма возвращается в исходное состояние.

Помимо элементов <INPUT>, формы могут содержать меню <SELECT> и поля для ввода текста <TEXTAREA>.

Меню <SELECT> из n элементов выглядит примерно так:

<SELECT NAME="[имя]">

<OPTION VALUE="[значение 1]">[текст 1]

<OPTION VALUE="[значение 2]">[текст 2]

...

<OPTION VALUE="[значение n]">[текст n]

</SELECT>

Как Вы видите, меню начинается с метки <SELECT> и заканчивается меткой </SELECT>. Метка <SELECT> содержит обязательный атрибут NAME, определяющий имя переменной, которую генерирует меню.

Метка <SELECT> может также содержать атрибут MULTIPLE, присутствие которого показывает, что из меню можно выбрать несколько элементов. Большинство браузеров показывают меню <SELECT MULTIPLE> в виде окна, в котором находятся элементы меню (высоту окна в строках можно задать атрибутом SIZE=[число]). Меню <SELECT> в большинстве случаев показывается в виде выпадающего меню.

Метка <OPTION> определяет элемент меню. Обязательный атрибут VALUE устанавливает значение, которое будет передано обработчику, если выбран этот элемент меню. Метка <OPTION> может включать атрибут checked, показывающий, что данный элемент отмечен по умолчанию.

Разберем небольшой пример.

<SELECT NAME=«selection»>

<OPTION VALUE=«option1» checked>Вариант 1

<OPTION VALUE=«option2»>Вариант 2

<OPTION VALUE=«option3»>Вариант 3

</SELECT>

Такой фрагмент определяет меню из трех элементов: Вариант 1, Вариант 2 и Вариант 3. По умолчанию выбран элемент Вариант 1. Обработчику будет передана переменная selection значение которой может быть option1 (по умолчанию), option2 или option3.

После всего, что мы уже узнали, элемент <TEXTAREA> может показаться совсем простым. Например:

<TEXTAREA NAME=address ROWS=5 COLS=50>

А здесь — Ваш адрес...

</TEXTAREA>

Все атрибуты обязательны. Атрибут NAME определяет имя, под которым содержимое окна будет передано обработчику (в примере — address). Атрибут ROWS устанавливает высоту окна в строках (в примере — 5). Атрибут COLS устанавливает ширину окна в символах (в примере — 50).

Текст, размещенный между метками <TEXTAREA> и </TEXTAREA>, представляет собой содержимое окна по умолчанию. Пользователь может его отредактировать или просто стереть.

Важно знать, что русские буквы в окне <TEXTAREA> при передаче обработчику могут быть конвертированы в соответствующие им символьные объекты.

Пример

Для демонстрации использования форм я написал небольшую программу на PHP, которая находится по адресу:

206.31.82.215/hp/nc/fd-win.pht

Исходные данные в эту программу передаст форма, описанная в примере 12:

<HTML>

<HEAD>

<TITLE>Пример 12</TITLE>

</HEAD>

<h2>Несколько более сложная форма </h2>

<FORM ACTION=«206.31.82.215/hp/nc/fd-win.pht»

METHOD=post>

<h3>Расскажите немного о себе...</h3>

<P>Указывать подлинные данные совсем не обязательно.

Для целей демонстрации вполне подойдут и вымышленные.

</P>

<P>Имя: <INPUT TYPE=text SIZE=40 NAME=fn><BR>

Фамилия: <INPUT TYPE=text SIZE=40 NAME=ln><BR>

Пол: <INPUT TYPE=radio NAME=gender VALUE=«male»

checked>мужской

<INPUT TYPE=radio NAME=gender

VALUE=«female»>женский<BR>

Возраст: <INPUT TYPE=text SIZE=5 NAME=age> лет<BR>

<INPUT TYPE=submit VALUE=«Запустить обработчик»></P>

</FORM>

</BODY>

</HTML>

Заполняйте форму, жмите на кнопку и смотрите, что будет...

Маленькая хитрость,

или Как отправить форму почтой

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

HTML предоставляет в Ваше распоряжение довольно мощный механизм пересылки содержимого форм по электронной почте. Вот как это выглядит на практике.

Допустим, что мы слегка изменили Пример 12. Вместо строки

<FORM ACTION=«206.31.82.215/hp/nc/fd-win.pht»

METHOD=post>

мы ввели строку

<FORM ACTION=«mailto:[email protected]»

ENCTYPE=text/plain>

Обратите внимание, что мы изменили алгоритм кодирования на text/plain, то есть фактически выключили кодирование вообще.

Предположим теперь, что пользователь указал, имя Иван, фамилию Петров, мужской пол и возраст 22 года. Теперь вопрос: что произойдет, если пользователь нажмет на кнопку Запустить обработчик?

Ответ прост. На адрес [email protected] электронной почтой автоматически будет отправлено сообщение следующего содержания:

fn=Иван

ln=Петров

gender=male

age=22

К сожалению, не все пользователи смогут воспользоваться такой формой. Дело в том, что всю работу по составлению сообщения и запуску почтовой программы для его отправки фактически берет на себя браузер пользователя. Это значит, что конфигурация доступа пользователя к Интернет должна обеспечивать одновременное функционирование протокола передачи гипертекстов и протокола доставки исходящей почты. Такое возможно не всегда. Тем не менее, даже если это невозможно, ничего смертельного не случится. Браузер просто выдаст сообщение об ошибке.

Правила хорошего тона при разработке HTML-документов

Производители браузеров часто добавляют к своим творениям поддержку меток, не входящих в текущую спецификацию HTML. Именно поэтому иногда можно встретить страницы, оптимизированные для того или иного браузера. На мой взгляд, это далеко не лучший подход. Однако, как говорил Рэй Брэдбери, единственный способ заставить писателя не писать — это кольт сорок пятого калибра. И писатели пишут...

Не питайте абсолютного доверия к визуальным редакторам HTML

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

Используйте продуманную иерархию заголовков

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

Следите за вложенностью меток

Современные браузеры способны правильно обработать вложенные метки. Например, вот такой фрагмент HTML-текста

<B><I>жирный наклонный шрифт</I></B>

большинство браузеров вполне успешно воспроизведут как жирный наклонный шрифт. Обратите внимание — метки <I>...</I> в этом фрагменте находятся внутри меток <B>...</B>. Другими словами, метки вложены одна в другую.

Работа браузера, однако, окажется сильно затрудненной, если вложенность окажется нарушенной, например:

<B><I>вложенность меток нарушена</B></I>

Соблюдение вложенности — очень важная часть общей культуры написания HTML-текста.

Указывайте альтернативный текст при включении в документ изображений

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

При разработке крупных документов создавайте оглавления

При написании крупного документа очень полезно поместить в его начале оглавление с гипертекстовыми ссылками на разделы. Это может облегчить пользователю работу с документом, особенно если документ носит справочный характер.

Хорошо продумайте навигацию

Попытайтесь вообразить себе, что в распоряжении пользователя нет кнопки Back. Подумайте о том, как обеспечить пользователю необходимую свободу перемещения в этом случае. Это поможет Вам спроектировать удобную в пользовании коллекцию HTML-документов.

Инструменты разработчика: пристрастные советы

Предупреждаю Вас честно: все приведенные ниже комментарии представляют собой мое личное (и, вполне вероятно, необъективное) мнение.

Визуальные редакторы HTML Netscape Navigator Gold

На мой взгляд, это лучший из редакторов типа «что видишь, то и получишь». Не сочиняет нестандартных меток, хотя некоторые стандартные (в частности, метки списков) пишет не лучшим образом. При попытке перейти из режима просмотра в режим редактирования иногда подвисает на томительные 30-40 секунд. На мой взгляд, недостаточно защищен от ошибок неопытного пользователя (хотя это относится только к подсистеме редактора; в режиме браузера работает четко).

Распространяется бесплатно.

Microsoft Front Page

Ходит по России в основном в виде версий для 30-дневных тестов с обезвреженным механизмом самоуничтожения. Наиболее крупных боляче

www.ronl.ru

Реферат тема: "Форматирование текста в MicroSoft Word"

РЕФЕРАТ

ТЕМА: "Форматирование текста в MicroSoft Word"

Форматирование с использованием стилей 3

Изменение стиля 3

Применение стиля 3

Задание стиля для следующего абзаца 3

Создание стиля 4

Удаление стиля 4

Стили для оформления маркированных и нумерованных списков 4

Копирование стилей в другой документ 5

Форматирование абзацев 5

Добавление обрамления и заливки к абзацам 8

Добавление обрамления к абзацам 8

Добавление заливки к абзацам 9

Использование табуляции 9

Установка позиций табуляции 9

Табуляция с заполнением 9

Удаление и перемещение позиций табуляции 10

Оформление указателей 10

Нестандартное оформление указателя 10

Обновление указателей 10

Создание оглавления 11

Создание оглавления с использованием встроенных стилей заголовка 11

Копирование форматирования одного раздела в другой раздел 11

Сохранение форматирования при копировании из одного документа в другой 11

Удаление символа абзаца 12

Использование колонтитулов 12

Создание колонтитулов 13

Удаление колонтитула 13

Контрольные вопросы и задание 14

Форматирование с использованием стилей

Изменение стиля

Для того чтобы изменить стиль необходимо выбрать команду «Стиль» в меню «Формат», после чего, в появившемся окне в поле “Стили” выберите стиль и нажмите кнопку “Изменить”, а для изменения атрибутов стиля нажмите кнопку «Формат».

Совет.

Чтобы применять модифицированный стиль в новых документах, основанных на текущем шаблоне, установите флажок "Добавить в шаблон". Модифицированный стиль будет добавлен в шаблон, присоединенный к активному документу.

Применение стиля

Для того, чтобы применить стиль к тексту необходимо выделите текст, а если это абзац, то, поместите курсор в любое место абзаца который нужно отформатировать. Выберите команду «Стиль» в меню Формат.

А потом, в появившемся окне выберите нужный стиль, а затем нажмите кнопку «Применить». Если требуемый стиль отсутствует в списке поля “Стили”, выберите другую группу стилей в поле «Список».

Совет.

Чтобы быстро наложить стиль, выберите стиль абзаца или символа в поле "Стиль" на панели форматирования. Имена стилей абзацев перед названием содержат значок документа; отличительной особенностью стилей символов является значок в виде подчеркнутой буквы "a".

Задание стиля для следующего абзаца

Для того, чтобы задать стиль для следующего абзаца выберите команду «Стиль» в меню «Формат», после чего в появившемся окне, в поле «Стили» выберите стиль, за которым хотите назначить следующий, а затем нажмите кнопку «Изменить».

А в поле «Стиль следующего абзаца» выберите стиль, который хотите определить в качестве стиля для следующего абзаца.

Создание стиля

Для создания стиля выберите команду «Стиль» в меню Формат, а затем нажмите кнопку «Создать». Потом введите имя нового стиля в поле «Имя». Далее выберите тип нового стиля в поле «Стиль». Нажмите кнопку «Формат», чтобы задать форматирование для нового стиля.

Примечание:

Обычно новый стиль создается на основе стиля, примененного к выбранному абзацу. Чтобы создать новый стиль на основе другого стиля, укажите стиль в поле «Основан на стиле».

Совет: Можно быстро создать стиль абзаца , основанный на стиле выделенного текста, если ввести имя нового стиля в поле "Стиль" панели форматирования.

Удаление стиля

Для удаления стиля необходимо проделать следующие пункты:

• Выберите команду «Стиль» в меню «Формат».

• В появившемся окне выберите стиль, который хотите удалить, а затем нажмите кнопку «Удалить».

Примечание:

Если удалить созданный пользователем стиль абзаца, на все абзацы с этим стилем будет наложен стиль «Обычный». Если удалить встроенный стиль, его можно вернуть обратно, выбрав значение «Всех стилей» в поле «Список».

Стили для оформления маркированных и нумерованных списков

Во многих шаблонах, входящих в состав программы Word, имеются стили для работы с нумерованными и маркированными списками. При использовании этих стилей все выделенные абзацы оформляются в соответствии с единым форматом и к ним автоматически добавляются маркеры или нумерация. Использование таких стилей предпочтительнее, чем использование кнопок панели инструментов или команды «Список», в следующих случаях:

• Список должен иметь отличающийся от текста формат, например меньший размер шрифта, курсив, другой интервал между строками или абзацами.

• Единый формат списка важен при работе с большим документом или документами, состоящими из нескольких частей. В этом случае документ может быть легко обновлен при изменении формата списка.

Имеющиеся встроенные стили могут быть изменены по усмотрению пользователя.

Копирование стилей в другой документ

Для копирования стилей в другой документ необходимо выбрать команду «Стиль» в меню «Формат», а затем нажмите кнопку «Организатор». После этого выберите стили для копирования из любого списка, а затем нажмите кнопку "Копировать".

В списке слева появятся стили, используемые в активном документе или шаблоне, в списке справа появятся стили шаблона документа «Обычный».

Совет:

Если шаблон, из которого требуется копировать стили, отсутствует в обоих списках, нажмите кнопку «Закрыть файл». Чтобы выбрать нужный шаблон или документ, нажмите кнопку «Открыть файл».

Форматирование абзацев

С помощью диалога Абзац можно установить любой из перечисленных в таблице 1 атрибутов. Оно открывается командой Абзац в меню Формат или же щелчком правой кнопки мыши в тексте и выполнением команды Абзац из контекстного меню. На рис.1 изображена вкладка Отступы и интервалы окна диалога Абзац, а на рис.2 - вкладка Положение на странице. Как и при работе с окном Шрифт, выбор атрибутов формата в окне диалога Абзац облегчается тем, что Word показывает образец текста, отформатированного с применением выбранных атрибутов.

Табл.1 Атрибуты формата абзаца

Левым отступом абзаца называется расстояние, на которое левая граница текста абзаца отстоит от левого поля страницы (положительный отступ) или на которое она заходит в левое поле (отрицательный отступ). Аналогично, правым отступом абзаца называется расстояние, на которое правая граница текста абзаца отстоит от правого поля страницы

рис.1 Вкладка Отступы и интервалы в окне диалога Абзац.

(положительный отступ) или на которое она заходит в правое поле (отрицательный отступ). Полями называют расстояние между областью, в которой может располагаться текст, и краями бумаги; размер полей устанавливается при настройке параметров страницы. Самый простой способ освоить различные параметры отступа - менять их значения и следить за изменениями в образце текста.

рис.2 Вкладка Положение на странице в окне диалога Абзац

Межстрочным интервалом называется суммарная высота каждой строки текста в абзаце.

Форматировать абзацы можно также с помощью панели инструментов форматирования и линейки (если последней нет в окне, выполните команду «Линейка» в меню Вид).

Для форматирования абзацев используются следующие кнопки панели инструментов форматирования:

Выравнивание по правому краю

Выравнивание по левому краю Увеличение левого отступа

Выравнивание по центру Уменьшение левого отступа

Выравнивание по ширине

Для установки отступов абзаца можно пользоваться линейкой

Перетащите для установки

левого отступа первой строки

Перетащите для установки

левого отступа всех строк

Перетащите для установки левого отступа

всех строк, кроме первой строки

Добавление обрамления и заливки к абзацам

Абзацы можно окружать линиями обрамления с любой из сторон, а также использовать заливку для затенения заднего плана текста абзаца.

Добавление обрамления к абзацам

Для добавления обрамления к абзацам установите указатель в любом месте абзаца, который требуется снабдить обрамлением. Потом выберите команду «Панели инструментов» в меню «Вид» и включите панель «таблиц».

На этой панели выберите подходящий тип линии из списка а так же требуемую толщину.

После этого кнопки вызвав меню кнопки «внешние граница» выберите необходимый вид обрамления и нажмите на кнопку.

Добавление заливки к абзацам

Для добавления заливки абзаца установите указатель в любом месте абзаца. На панели таблиц в меню кнопки заливки выберите цвет заливки для вашего абзаца, а потом нажмите саму кнопку. Надо отметить, что для осуществления заливки у абзаца должно быть обрамление.

Использование табуляции

Установка позиций табуляции

Выделите абзацы, в которых необходимо установить позиции табуляции.

Щелкайте левую часть горизонтальной линейки, пока она не изменится на необходимый тип табуляции:

Щелкните горизонтальную линейку в том месте, где необходимо установить позицию табуляции.

Примечание.

Для установки точного размера табуляций выберите команду «Табуляция» в меню Формат.

Табуляция с заполнением

Выделите абзацы, в которые собираетесь вставить символы заполнения перед позициями табуляции.

• Выберите команду Табуляция в меню «Формат».

• В поле «Позиции табуляции» введите позицию новой табуляции или выберите существующую позицию, к которой хотите добавить символ заполнения.

• В группе «Выравнивание» выберите тип выравнивания символов заполнения.

• В группе «Заполнитель» выберите нужные параметры и нажмите кнопку "Установить".

Удаление и перемещение позиций табуляции

1. Выделите абзацы, в которых собираетесь удалить или передвинуть позицию табуляции.

2. Чтобы удалить позицию табуляции, перетащите маркер табуляции на горизонтальной линейке влево до упора.

3. Чтобы передвинуть позицию табуляции, перетащите маркер табуляции на горизонтальной линейке вправо или влево.

Оформление указателей

Нестандартное оформление указателя

Для оформления указателя выберите команду «Оглавление и указатели» в меню «Вставка», а затем - нужную вкладку. После этого в появившемся окне в поле «Форматы» выберите значение «Специальный», а затем нажмите кнопку «Изменить». В поле «Стили» выберите стиль, который хотите изменить, а затем нажмите кнопку «Изменить».

Нажмите кнопку «Формат», а затем выберите нужные параметры форматирования.

После этого, вернувшись в окно диалога «Оглавление и указатели», можно просмотреть полученные результаты форматирования в поле «Образец».

Обновление указателей

Для обновления указателей поместите курсор в любое место указателя, который собираетесь обновить а потом нажмите клавишу F9.

Примечание.

Если указатель обновляется полностью, будут потеряны все данные и форматирование, внесенные в него вручную.

Создание оглавления

Оглавление создается с помощью стилей, которыми оформлены заголовки документа. Можно использовать встроенные стили заголовков, входящие в поставку программы Word, или создать собственные стили заголовков.

Создание оглавления с использованием встроенных стилей заголовка

Для начала наложите на заголовки, которые собираетесь отобразить в оглавлении, стили заголовков, входящие в поставку программы Word (стили «Заголовок 1» - «Заголовок 9»).

Поместите курсор в место, куда хотите вставить оглавление.

Выберите команду Оглавление и указатели в меню «Вставка», а затем - вкладку «Оглавление». Чтобы выбрать один из готовых стилей, укажите его в поле «Форматы».

Копирование форматирования одного раздела в другой раздел

Если документ содержит несколько разделов, можно скопировать форматирование раздела, скопировав соответствующий разрыв раздела. При вставке этого разрыва раздела на новое место расположенный над ним текст принимает соответствующее форматирование.

Сведения о формате последнего раздела документа хранятся в последнем символе абзаца этого документа.

Совет.

Если форматирование конкретного раздела планируется использовать в других документах, сохраните соответствующий разрыв раздела как элемент списка автотекста и вставляйте его по мере необходимости.

Сохранение форматирования при копировании из одного документа в другой

При копировании из одного документа в другой применяемое при этом форматирование зависит от копируемого фрагмента.

Не содержит символ абзаца () Копируется стиль символа и любое другое форматирование символов, примененное к первому символу фрагмента.

Является символом абзаца Копируется стиль абзаца и любое другое форматирование абзаца, примененное к этому абзацу.

Содержит символ абзаца Копируется стиль абзаца и любое другое форматирование абзаца, примененные к этому абзацу, а также стиль символа и любое другое форматирование символов, примененное к первому символу фрагмента.

Содержит разрыв раздела Копируется все форматирование раздела, включая поля, количество столбцов, количество строк, размер и ориентацию страницы, верхний и нижний колонтитулы.

Удаление символа абзаца

Сведения о формате абзаца хранятся в символе абзаца. Если вырезанный текст содержит символ абзаца, оставшийся текст примет стиль следующего абзаца.

Использование колонтитулов

Колонтитул - это текст и/или рисунок (номер страницы, дата печати документа, эмблема организации, название документа, имя файла, фамилия автора и т. п.), который печатается внизу или вверху каждой страницы документа. Существует возможность использовать один и тот же колонтитул для всего документа или определить разные колонтитулы для разных частей документа. Например, допускается создать уникальный колонтитул для первой страницы документа или вообще убрать верхний и/или нижний колонтитул с первой страницы. Можно также создавать отличающиеся колонтитулы для четных и нечетных страниц некоторых разделов или всего документа.

Создание колонтитулов

• Выберите команду Колонтитулы в меню Вид.

• Для создания верхнего колонтитула введите текст или рисунок в область верхнего колонтитула или нажмите кнопку на панели инструментов Колонтитулы.

• Для создания нижнего колонтитула нажмите кнопку Верхний/нижний колонтитул для перехода в область нижнего колонтитула. Затем повторите шаг 2.

• По окончании нажмите кнопку «Закрыть»

Чтобы вставить нажмите кнопку:

Номера страниц

Текущую дату

Текущее время

Стандартный элемент колонтитула, например должным образом отформатированный номер страницы (Стр. 1 из 10), имя файла или фамилию автора «Вставить автотекст», а затем щелкните нужный элемент.

Совет.

По умолчанию содержимое колонтитула автоматически выравнивается по левому краю. Существует возможность выровнять содержимое колонтитула по центру или выровнять дату по левому краю, а номер страницы - по правому краю. Для выравнивания элемента по центру нажмите клавишу TAB; для выравнивания элемента по правому краю нажмите клавишу TAB дважды.

Удаление колонтитула

Для удаления колонтитула выберите команду «Колонтитулы» в меню «Вид».

Если требуется, перейдите к верхнему или нижнему колонтитулу, который следует удалить. После этого выделите содержимое колонтитула, а затем нажмите клавишу DEL.

Примечание.

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

Контрольные вопросы и задание

1. Как отформатировать документ с использованием стилей? Какие основные действия предусмотрены для работы со стилями?

2. Что такое колонтитулы и для чего они применяются?

3. Необходимо выровнять текст по ширине, добавить отступ, рамку и заливку цветом. Так же необходимо изменить межстрочный интервал (на личное усмотрение).

refdb.ru

Реферат Программирование и комп-ры Ввод и форматирование текста в Word

Кафедра 603

Реферат

Как вводить текст

Вставка специальных символов.

Способы выделения текста

Отмена и повторение выполненных действий

Редактирование выделенного текста.

Перемещение и копирование текста

Приемы форматирования текста

Задание параметров шрифта

Форматирование абзацев

Атрибут формата абзаца Описание

Отступы и интервалы

Отступ

Горизонтальное расположение текста абзаца относительно полей документа

Интервал перед

Дополнительный вертикальный интервал, вставляемый перед абзацем

Интервал после

Дополнительный вертикальный интервал, вставляемый после абзаца

Межстрочный интервал

Вертикальное расстояние между строками текста в абзаце - например, одиночный или двойной интервал или его точное значение

Выравнивание

Выравнивание текста абзаца: по левому краю (текст выравнивается по левому отступу), по правому краю (текст выравнивается по правому отступу), по центру (по центру между левым отступом первой строки и правым отступом), по ширине (по обоим отступам)

Положение на странице

Запрет висячих строк

Предотвращает вывод одиночной последней строки абзаца в начале новой страницы или вывод первой строки абзаца в конце страницы

Не разрывать абзац

Все строки абзаца должны быть выведены на одной странице - другими словами, Word не производит разрыва страниц в абзаце

Не отрывать от следующего

Не позволяет Word вставлять разрыв страницы между данным и следующим абзацем

С новой строки

Абзац выводится с новой страницы

Запретить нумерацию строк

Если строки документа нумеруются, абзац исключается из нумерации

Запретить автоматический перенос слов

К абзацу не применяется автоматическая расстановка переносов

Копируемый фрагмент

Действие

Не содержит символ абзаца ()

Копируется стиль символа и любое другое форматирование символов, примененное к первому символу фрагмента.

Является символом абзаца

Копируется стиль абзаца и любое другое форматирование абзаца, примененное к этому абзацу

Содержит символ абзаца

Копируется стиль абзаца и любое другое форматирование абзаца, примененные к этому абзацу, а также стиль символа и любое другое форматирование символов, примененное к первому символу фрагмента.

Содержит разрыв раздела

Копируется все форматирование раздела, включая поля, количество столбцов, количество строк, размер и ориентацию страницы, верхний и нижний колонтитулы.