Лабораторная 3 Работа с текстом


Чтобы посмотреть этот PDF файл с форматированием и разметкой, скачайте его и откройте на своем компьютере.
Работа с текстом

Текст


единственный объект Web
-
страницы, который не требует
специального

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

умолчанию как текстовые данные.

Но, тем не менее, работая с текстом, на веб
-
странице стоит
помнить
ряд правил:

1.

О расстановке пробелов и переносе строк
.



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



Это же правило относится
к символам табуляции и переносу
текста


в браузере они не видны. Поэтому не ставьте лишних
пробелов, поскольку это лишь увеличит общий объем файла,
но никак не изменит вид документа в браузере.



Исключением из этого правила является тег
, внутри 

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

2.

О переносах в тексте
.



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

3.

Текст размещается по всей ширине окна браузера
.



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



Если же в тексте нет знаков пробела или дефиса, браузер
от
образит ее в одну строку, добавив горизонтальную полосу
прокрутки, если она шире окна браузера.


Д
ля форматирования текста существует

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


теги
логического форматирования и теги физическ
ого форматирования
.

Теги
физического форматирования

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

В группу
тегов логического форматирования

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

О
сновное предназначение

этих тегов
-

логическо
е

выделени
е

отдельных элементов HTML.

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

Теги физического форматирования

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

слов, фраз, предложений.

Структурное форматирование
. Абзацы, отступы и переносы.

Как известно, любой текст имеет свою структуру. Книги разделены
на части, главы и разделы. Газеты и ж
урналы имеют отдельные рубрики
и подзаголовки, которые, в свою очередь, включают фрагменты текста,
также имеющие свою собственную внутреннюю структуру


абзацы,
отступы, параграфы и пр.

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

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

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

реализует это при нажатии
клавиши .
Как уже

было сказано выше, в

HTML
-
документах
символы перевода строки не приводят к образованию нового абзаца.

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

Например, код представленный ниже демонстрирует эту
возможность. Результат работы можно увидеть на рисунке 3.


html




head




title

Применение

абзацев
/
title



&#x/hea;퀀/head


ody;body

Позови меня с
собой,

&#x/p00;/p

Я пройду сквозь злые ночи,



Я отправлюсь за тобой,



Что бы путь мне ни пророчил.



Я приду туда, где ты



Нарисуешь в небе солнце,



Где разбитые мечты



Обретают снова силу высоты.



Татьяна Снежин
а



/
body
�/
html




Рисунок 3. Результат отображения представленного кода в
браузере.


Как видно из рисунка, при использовании тега

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


Итак,

ody;body

Позови меня с собой,


Я пройду сквозь злые ночи,


Я отправлюсь за

тобой,


Что бы путь мне ни пророчил.


Я приду туда, где ты


Нарисуешь в небе солнце,


Где разбитые мечты


Обретают снова силу высоты.

&#x/p00;/p

Татьяна Снежина



&#x/bod;&#xy000;/body
.

Результат представлен на рисунке 4.



Рисунок 4.


Возникают сит
уации, когда необходимо выровнять текст не по
левому краю, как по умолчанию выполняет браузер, а например, по
центру или как в нашем примере по правому краю для указания автора
строк. Для этого возможно использование тега <
p
> с параметром
ALIGN
.


Существую
т следующие значения
параметр
а

ALIGN, отвечающ
его

за тип горизонтального выравнивания текста в окне браузера.



ALIGN="
l
eft"


текст выровнен по левому краю (значение
параметра, принятое по умолчанию).



ALIGN="center"


текст располагается посередине окна
бр
аузера.
Н
е рекомендуется при работе с большими
фрагментами текста, т. к. из
-
за различной длины слов восприятие
абзаца затрудняется;



ALIGN="right"


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



ALIGN="justify"


выравнивание по ширине окна браузера.

Это
значение является общепринятым стандартом оформления
текстовых блоков делового содержания. Рекомендовано к
использованию.



Таким образом,
второй абзац должен принять следующий вид:

Татьяна Снежина




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

или перемещением ползунка
линейки настроек рабоч
ей области документа.
Четыре

следующих
элемента позволяют внести некоторую определенность в формат абзаца
HTML
-
документа
.




Отступы.


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


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



Перевод строки
.


Как мы уже рассматривали,
BR&#x-3B3;&#xR-40;
используется для принудительного
перевода строки. Этот тег один из немногих, не является парным и
поэтому не имеет соответствующего закрывающего тэга.
В месте
его
размещения строка заканчивается, а оставшийся текст печатается с
новой строки.

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



Запрет перевода строки
NOBRN3O;µR-;䀀.



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

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

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



Мягкий перевод строки.


Размечая текст с помощью тэга неразрывной строки можно
получить очень длинные строки. Чтобы этого избежать, можно
указать браузеру место возможного перевода строки, что будет
выполнено только при необходимости. Эт
о можно осуществить,
поставив в нужном месте текста тэг (Word BReak), который
так же, как и тэг
, не нуждается в закрывающем тэге.

Выделение отдельных слов, фраз, предложений
.

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


Таблица 4.

Тег

Функция

Рекомендуется

<В>


Отображение полужирным
шрифтом.

STRONS-3;&#xT3R3;&#xON-3;&#xG000;G


I
� /
I


Отображение

курсивом


ЕМ
�, VARVA4;&#xR-40; CITEL-4;&#xITE3;,

<ТТ>


Отображение

моноширинным
шрифтом


CODE
�,
SAMP

,


KBD
�.



К
тегам, работающим с размерами текста относят следующие:

Тег

Функция

BҳI;&#xG000;IG
/
BIG


Отображение текста шрифтом большего (чем
непомеченная часть текста) размера.

SMALLS-3;&#xMA3L;L-4;


/
SMALL�

Отображение текста

шрифтом меньшего
размера

SUBS-3;&#xUB50;
/
SUB�

Сдвиг текста ниже
уровня строки и вывод его
(если возможно) шрифтом меньшего размера.
Удобно использовать для математических
индексов.

SU
P

/
SU
P


Сдвиг текста выше уровня строки и вывод его
(если возможно) шрифтом меньшего размера.
Удобно использовать для задания степеней

чисел.


Одн
им

из основных тегов физического форматирования текста,
отображающий свойства шрифтов

является
FONTO-3;&#xON-3;&#xT300;
.
Тег является
парным, д
ля него могут использоваться следующие параметры
.

Параметр

Функция

FACE


Служит для указания типа шрифта, которым программа

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


Значение параметра


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

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

Параметр

Функция

Можно указать как один, так и несколько названий
шрифтов, разделяя их запятыми. Список шрифтов
просматривается слева направо.


FONT

FACE
="
Verdana
", "
Arial
",
"
H
�"

Пример задания названия шрифта.

Или же


FONT

face
="
Arial
;
Verdana
;
Tahoma
"


Пример задания названия шрифта.FONT


SIZE

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


значение

3. Размер шрифта
указывается как абс
олятной

величиной (SIZE=2), так и
отн
осительной

(SIZE=+1).

COLOR

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

FON
T COLOR="red">текст будет написан
красным цветом.

Например,


FONT

FACE
="
Tahoma
", "
"
COLOR
="
TT
000000"
312Е="2">Этот текст будет показан одним из 3
-
х
указанных шрифтов, черным цветом и размером "1".


В завершение разговора о тегах физического форматирования
стоит

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

закрывающих тегов должен быть обратным)



должен
работать эффект «Матрешки»
.

Теги логического форматирования

Что мы делаем, когда хотим обратить внимание читателя на что
-
то
важное? Правильно, выделяем важное курсивом. Или полужирным. Или
подчеркиваем. Или еще как
-
нибудь.

Но страница, где встречается сразу несколько вариантов выделения,


и подчеркивание, и курсив, и еще что
-
нибудь


выглядит, мягко
говоря, любительски,
или даже

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


Тег

Функция

Отображение

на экране

<ЕМ>

От англ. слова EMphasis


постановка ударения, выделение,
подчеркивание.

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

курсив

(так же, как теги
и ).

STRONS-3;&#xT3R3;&#xON-3;&#xG000;G

/STRONG/S-;T3R;ON4;&#xG-50;


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

STRONG> обычно размечают
более важные фрагменты текста,
чем те, что размечены тэгом <ЕМ>

жирное начертание

HI0;HI,
<Н2>... <Н6>


<Н><
/
Н> с указанием одной из
цифр (от 1 до 6) задает
определенный размер заголовка
всего текста целиком или его
конкретного
фрагмента.

Заголовок <
Н6

будет
минимальным




самым большим.
Подразумевается
отступ от текстовой
части.


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

Ответ


в названии этой группы элементов. Они предназначены
для расстановки логических ударений, выделения логических часте
й и
подчеркивания сути высказываний. Их использование весьма актуально,
поскольку, вероятно, в ближайшем будущем возможности браузеров
возрастут, например, станет возможен поиск цитат на Web
-
пространстве

ит.п
. Кроме того,

авторам документов ничто не мешает

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

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

поработали? Измятая бумага?
Конечно, можно

имитировать пот
ертости, вмятины и жирные пятна за
счет соответствующей графики... Но
сейчас не об этом
. Многочисленные
исправления! Их
-
то можно без особого труда внести и в электронный
документ. Да, но ведь на то он и электронный, чтобы даже после
основательной переделки

не содержать помарок! Их остается только
имитировать.


Тег

Функция

Отображение
на экране

DEL퓤&#xL400;/DEL&#x/-3D;ӤL;䀀

Используется для обозначения
удаленного текста.

Имеет необязательные для указания
параметры DATETIME (дата удаления
-

YYYY
-
MMDDThh

:
mm:ssTZD,

часовой
по
яс Time Zone
) и CITE (URL
-
адрес
документа
-

источник причины
удаления).

2013
-
10
-
�&#x/DEL;29T16:12:53+0.003.2/DEL

Зачеркнутый



IN&#xIN4S;&#x/INS;S /INS

Используется для обозначения
вставленного текста.

Имеет необязательные для указания
параметры DATETIME
(дата вставки
-

YYYY
-
MMDDThh

:
mm:ssTZD,

часовой
пояс Time Zone
) и CITE (URL
-
адрес
документа
-

подробности внесенных
дополнений).

подчеркивание


HTML придумал программист...

Именно такая мысль приходит в
голову, когда встречаешь в HTML целый
«
букет
»

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


например, по физике или математике


встречается переменная, то она выво
дится курсивом.

Следующие теги позволяют это сделать.


Тег

Функция

Отображение

на экране

CODEӃO; -3E; /CODE/CO;=-5;

Используется для
форматирования
небольшого фрагмента
программы

моноширинный шрифт

SAMPS-3; M3P;&#x-300;/SAMP/S-;ZM3;&#xP-30;

Используется при
иллюстрации, примеров
(sample),
вывода данных на
экран.

моноширинный шрифт

VARVA4;&#xR-40; /VAR/VA;&#xR-20;


Используется для
выделения
имен

переменных (variable).

моноширинный шрифт

PREP-3;&#xR3E3;/PRE/P-;R3E; 

Используется для
выделения больших
фрагментов (листингов)
кода.

моноширинный шрифт

KBDKB5; -50; /KBD/KB;=-5;

Предназначен
для
выделения текста,
вводимого с клавиатуры
(keyboard).

моноширинный шрифт
в полужирном
начертании


Есть одно различие в использовании тэгов и
. В 

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

, об этом мы уже ранее говорили
.

Сокращения
.

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

В Web
-
документах такая проблема
легко
решается

с помощью
следующих тегов
.

Тег

Функция

Отображение на
экране

ACRONYҬ-;R3O;&#xN4Y-;M00;M
/ACRONYM/AC;R-4;&#xON4Y;&#xM-40;

ABBRҫ-;ʳR; /ABBR/AB;&#x-4B3;&#xR-40;

Используется для
расшифровки аббревиатур.
Реализуется

через параметр TITLE.

Значение п
араметра
выводится на экран
при наведении на
интересующее слово


ACRONYM TITLE="HyperText Markup Lan¬RO;&#xNYM ;&#x-591;&#xTIT-;LE=;&#x"Hyp;rTe;&#xxt -;֑M; rku;&#xp -5;‘La;&#xn-7g;&#xuage;&#x"000;guage" HTML
&#x/ACR;&#xONYM;/ACRONYM

Цитаты
.

Согласно правилам русского язык
а, цитаты заключаются в кавычки,

в электронных публикациях
они добавляются

также

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

Но, кроме кавычек, цитаты обычно
выделяются форматированием.

Для коротких


не больше одного предложения


цитат, как
правило, достаточно курсива.

Более длинные


на несколько
предложений


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

За работу с цитатами отвечают следующие теги:


Тег

Функция

Отображение на
экране

CITEӃI;&#xTE-4; /CITE/-9;ÃIT;

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

курсив
, в
изуально
аналогичен тегам
<ЕМ> и <
I


BLOCKQUOTEҳL;&#x-4OC;KQ-;UO4;&#xT-4E; 

/BLOCKQUOTE/BL;O-5;ÃKQ;U-5;&#xOT5E;&#x-400;

Используется для разметки

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

отдельный абзац с
отступом

Q00;Q /Q/Q-;瀀

Используется для разметки
коротких цитат

Имеет параметр CITE, в
качестве значения которого
можно указать источник
цитаты.

курсив


Центрирование
.

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

этого парного

тега, подлежат горизонтальному выравниванию по
середине окна браузера. В сущности, тег
представляет собой
а
налог значения ALIGN="center" того тега, результат отображения
которого будет отцентрирован на экране монитора. Полезно
использовать
этот тег
для центрирования таких элементов, как,
например, таблиц,
где непременимо

назначение ALIGN="center"
.

Горизонтальны
е линии
.

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

HR&#x-3HR;倀
. Они визуально подчеркивают
законченность той или иной области страницы.
Ч
асто используют
рельефную, вдавленную линию, чтобы обозначить
«
объемность
»

докумен
та.

Тег н
е требует
парного
закрывающего. До и после линии

автоматически вставляется пустая строка.

Основны
ми

параметр
ами этого тега являются:

Параметр

Функция

ALIGN


Выравнивает по краю или центру;

имеет значения LEFT,CENTER, RIGHT

WIDTH

Устанавливает
длину линии в пикселах или процентах
от

ширины окна браузера

SIZE

Устанавливает толщину линии в пиксел
я
х

NOSHADE

Отменяет рельефность линии

COLOR

Указывает цвет линии. Используется формат RGB или

стандартное имя

цвета
.


HR ALIGN=CENTER WIDTH=50%
�NOSHADE


Комментарии
.

Если горизонтальная линия является визуальным разделителем
фрагментов текста, то комментарии невидимы на экране монитора, но
в
то

же время могут нести большой объем информации.

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

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

Любой HTML
-
комментарий дол
жен начинаться с конструкции -

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


!


Начало блока
новостей



Код блока новостей...

!


Окончание блока новостей




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

Текстовые блоки
и .

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

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


Фрагмент текста,
набранный серым цветом
&#x/DIV;/DIV


Между
и имеются сущ
ественные отличия.



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



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


это вызовет
принудительный перенос строки.

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


Специальные символы

В ходе создания того или иного HTML
-
документа часто бывает
необходимо отобразить в браузере символы, используемые в
спецификации языка HTML: угловые скобки, обозначающие теги (<

�),
знак амперсанда (&) и т. д.
Использование таких симв
олов,
непосредственно введенны
х

в HTML
-
документ, буд
е
т интерпретирован
о
совсем
не так, как задумал автор.

Чаще всего это случается при
добавлении в исходный документ

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


Тогда нам на помощь приходят специальные кодовые комбинации.

Эти коды состоят из символа амперсанда (&) и следующим за ним
именем символа или его десятичным или шестнадцатеричным
значением. Заканчиваться спец
иальный символ должен знаком
«
точка с
запятой
»
.

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

Условно все специальные символы HTML можно разделить на три
большие

категории:



символы, отображающие элементы HTML
-
форматирования

(табл. 5)
;



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

(табл. 6)
;



буквы иностранных алфавитов

(табл. 7)
.


Причем д
л
я каждого специального символа существуют два
способа записи


кодовый и числовой. К примеру, конструкции §
и § совершенно одинаково будут выводиться

в окне браузера в виде
значка параграфа.

Первый вариант задается

путем указания амперсанда
(&),

знака диеза (#) и числового кода
, а второй

с помощью специальной
кодовой конструкции (знак амперсанда (&) и соответствующее
наимнование).


Символы, отображающие элементы HTML
-
форматирования.

Таблица 5. Символы
HTML
-
форматирования.

Запись специального симв
ола

Назначение

<
;

Знак
«
меньше
»

>
;

Знак
«
больше
»

&
;

Амперсанд

"
;

Знак
«
кавычки
»


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

К так называемым символам оформления HTML
-
документов
относятся значки авторского права, зарегистрированной торговой марки,
симво
лы иностранных валют, математические обозначения (
«
плюс
-
минус
»
,
«
умножить
»

и др.), а также прочие символы.

Наиболее
употребляемые из них представлены в таблице 6.


Таблица 6. Символы оформления документа.


Запись специального символа

Назначение

®

Заре
гистрированная торговая
марка

&сору;

Знак copyright



(ав
то
рских
прав)

± ±

Знак «плюс
-
минус»

§ §

Знак параграфа

&
#215
;

Знак «умножить»

&
#
171;

Левая кавычка «елочка»

&
#
187;

Правая кавычка «елочка»

&
#
32;

Пробел

&
#
45;

Дефис

&
#
1
73;

Мягкий перенос

&
larr;

&
#
8592
;

Стрелка влево

&
uarr
;
&
#
859
3;

Стрелка вверх

&
rarr
;
&
#
8594
;

Стрелка вправо

&
darr
;
&
#
859
5
;

Стрелка вниз

&
harr
;

&
#
8596
;

Стрелка влево
-
вправо


Зная конструкции символов оформления, можно существенно
облегчить процесс созд
ания HTML
-
документов.
Так, е
сли
необходимо

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

Буквы иностранных алфавитов

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

на
французском

языке, алфавит которого содержит
некоторые буквы, начертание
которых
характерно только лишь для
данного языка.
Или столь популярные в математическом языке α, β, γ, π.

Ка
к можно

выйти из такого положения?

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

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

Добавить еще один язык или того хуже


сделать их картинками. Но м
ы
забыли о конечной цели ввода такого текста


быть
интерпретированным, причем корректно, браузером.

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

Таблица 7. Буквы иностранных алфавитов.

Запись специального символа

Назначение

&
#
945
;

Строчная буква а
льфа

&
#
946
;

Строчная буква бета

&
#
947
;

Строчная буква гамма

&
#
960
;

Строчная буква пи

&
#
955
;

Строчная буква лямбда


Лабораторная работа №
3

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




Задание.

Используя полученные знания,



разбейте текст страницы на абзацы, вставив места возможных переносов



выделите цветом, размером, шрифтом, начертанием важные моменты страницы,



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



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



Добавьте 2 разделяющие горизонтальные линии



Добавьте в текст страницы небольшое стихотворение с указанием автора строк.



Приложенные файлы

  • pdf 15144688
    Размер файла: 508 kB Загрузок: 0


Добавить комментарий