Файл: Основы программирования на языке HTML (СТРУКТУРА HTML-ДОКУМЕНТА).pdf
Добавлен: 29.03.2023
Просмотров: 261
Скачиваний: 1
2.3 КОДЫ HTML СИМВОЛОВ
Для специальных символов в HTML[9]-стандартах предусмотрен особый способ кодирования (с помощью escape[10]-последовательностей или символьных объектов), который позволяет применять эти символы в необходимых позициях документа, не нарушая его структуры (это касается, например, символов <, >и &). Условное обозначение спецсимвола (escape-последовательность) начинается символом &, включает собственно имя спецсимвола и завершается точкой с запятой (например, « у условное обозначение для кавычки). Кроме того, вместо имени символа можно воспользоваться соответствующим ASCII-кодом (например, " у для кавычки).
Следует отметить, что разными браузерами коды и имена специальных символов (escape-последовательности) могут интерпретироваться несколько различным образом. На вид отображаемых символов также влияет выбранный для отображения шрифт и таблица символов (кодировка).
|
Название |
Символ |
ASCII |
Имя |
|
|
Табулятор |
	 |
|||
|
Перевод строки |

 |
|||
|
Возврат каретки |

 |
|||
|
Пробел |
  |
|||
|
Восклицательный знак |
! |
! |
||
|
Кавычка |
« |
" |
" |
|
|
Знак решетка |
# |
# |
||
|
Доллар |
$ |
$ |
||
|
Процент |
% |
% |
||
|
Амперсанд |
& |
& |
& |
|
|
Апостроф |
" |
' |
||
|
Скобка левая круглая |
( |
( |
||
|
Скобка правая круглая |
) |
) |
||
|
Звездочка |
* |
* |
||
|
Плюс |
+ |
+ |
||
|
Запятая |
, |
, |
||
|
Минус |
- |
- |
||
|
Точка |
. |
. |
||
|
Косой штрих |
/ |
/ |
||
|
Цифры |
0-9 |
0 -9 |
||
|
Двоеточие |
: |
: |
||
|
Точка с запятой |
; |
; |
||
|
Меньше |
< |
< |
||
|
Равно |
= |
= |
||
|
Больше |
> |
> |
||
|
Знак вопроса |
? |
? |
||
|
Знак обезьянка |
@ |
@ |
||
|
Прописные буквы |
A-Z |
A -Z |
||
|
Скобка квадратная левая |
[ |
[ |
||
|
Косой штрих с наклоном вправо |
\ |
\ |
||
|
Скобка квадратная правая |
] |
] |
||
|
Степень |
^ |
^ |
||
|
Знак подчеркивания |
_ |
_ |
||
|
Ударение |
` |
` |
||
|
Строчные буквы |
a-z |
a -z |
||
|
Фигурная скобка левая |
{ |
{ |
||
|
Вертикальный штрих |
| |
| |
||
|
Фигурная скобка правая |
} |
} |
||
|
Тильда |
~ |
~ |
||
|
Запятая |
‚ |
‚ |
||
|
Флорин |
ѓ |
ƒ |
||
|
Кавычка нижняя правая |
&; #132; |
„ |
||
|
Многоточие |
… |
… |
||
|
Крест |
† |
† |
||
|
Двойной крест |
‡ |
‡ |
||
|
Крышка |
€ |
ˆ |
||
|
Промилле |
‰ |
‰ |
||
|
Параграф |
Љ |
Š |
||
|
Символ меньше |
< |
‹ |
||
|
Большое ОЕ |
Њ |
Π|
||
|
Одинарная кавычка слева |
` |
‘ |
||
|
Одинарная кавычка справа |
" |
’ |
||
|
Кавычка слева |
“ |
“ |
||
|
Кавычка справа |
” |
” |
||
|
Крупная точка |
* |
• |
||
|
Короткий дефис |
- |
– |
||
|
Длинный дефис |
- |
— |
||
|
Тильда |
|
˜ |
||
|
Торговый знак |
™ |
™ |
® |
|
|
љ |
š |
|||
|
Символ больше |
> |
› |
||
|
Маленькое ое |
њ |
œ |
||
|
Большой Y-умлаут |
џ |
Ÿ |
||
|
Неразрывный пробел |
  |
|
||
|
Перевернутый восклицательный знак |
Ў |
¡ |
&ixcl; |
|
|
Цент |
ў |
¢ |
¢ |
|
|
Фунт |
Ј |
£ |
£ |
|
|
Валюта |
¤ |
¤ |
¤ |
|
|
Иена |
Ґ |
¥ |
¥ |
|
|
Прерванный штрих |
¦ |
¦ |
¦ |
|
|
Параграф/Раздел |
§ |
§ |
§ |
|
|
Точки умлаута |
Ё |
¨ |
¨ |
|
|
Копирайт |
© |
© |
© |
|
|
Порядковое числительное женского рода |
Є |
ª |
ª |
|
|
Французская кавычка слева |
« |
« |
« |
|
|
Не/Нет |
¬ |
¬ |
¬ |
|
|
Разрыв в месте переноса |
- |
­ |
­ |
|
|
Зарегистрированный торговый знак |
® |
® |
® |
|
|
Надчеркивание |
Ї |
¯ |
¯ |
|
|
Градус |
° |
° |
° |
|
|
Плюс-минус |
± |
± |
± |
|
|
Вторая степень |
І |
² |
² |
|
|
Третья степень |
і |
³ |
³ |
|
|
Маленькое а с ударением |
ґ |
´ |
&acuate; |
|
|
Мю |
µ |
µ |
µ |
|
|
Параграф |
¶ |
¶ |
¶ |
|
|
Средняя точка |
· |
· |
· |
|
|
Цедиль |
ё |
¸ |
¸ |
|
|
Первая степень |
№ |
¹ |
¹ |
|
|
Порядковое числительное мужского рода |
є |
º |
º |
|
|
Французская кавычка справа |
« |
» |
» |
|
|
Дробь ј |
ј |
¼ |
¼ |
|
|
Дробь Ѕ |
Ѕ |
½ |
½ |
|
|
Дробь ѕ |
ѕ |
¾ |
¾ |
|
|
Перевернутый вопросительный знак |
ї |
¿ |
¿ |
|
|
Большая А с ударением |
А |
À |
À |
|
|
Большая А с ударением |
Б |
Á |
Á |
|
|
Большая А с крышкой |
В |
 |
 |
|
|
Большая А с тильдой |
Г |
à |
à |
|
|
Большая А-умлаут |
Д |
Ä |
Ä |
|
|
Большая А с кружком |
Е |
Å |
Å |
|
|
Большое АЕ |
Ж |
Æ |
Æ |
|
|
Большая С цедил |
З |
Ç |
Ç |
|
|
Большая Е с ударением |
И |
È |
È |
|
|
Большая Е с ударением |
Й |
É |
É |
|
|
Большая Е с крышкой |
К |
Ê |
Ê |
|
|
Большая Е-умлаут |
Л |
Ë |
Ë |
|
|
Большая I с ударением |
М |
Ì |
Ì |
|
|
Большая I c крышкой |
О |
Î |
&Icirс; |
|
|
Большая I-умлаут |
П |
Ï |
Ï |
|
ГЛАВА 3. ФОРМАТИРОВАНИЕ ТЕКСТА, СИМВОЛОВ
Все теги форматирования символов имеют как открывающий, так и закрывающий компонент и действуют на заключенные между ними текст.
Основным является тег... FONT>, обязательно использующийся с одним или несколькими атрибутами, изменяющими размер, цвет и гарнитуру шрифта:
|
Синтаксис атрибута[11] |
Назначение |
|
|
SIZE = значение |
Размер задается либо в форме абсолютного значения (число от 1 до 7), либо относительно размера основного шрифта (в форме +n или -n). |
|
|
COLOR = цвет |
Цвет |
|
|
FACE = список шрифтов |
Гарнитуры для отображения текста; названия перечисляются в порядке предпочтения через запятую, например, FACE=«Verdana, Helvetica, Arial, Sans-Serif» Можно указывать и одну из гарнитур, но следует учитывать, что данный шрифт может быть не установлен на компьютере пользователя, и «экзотические» шрифты отображаться браузером не будут |
|
3.1 ФОРМАТИРОВАНИЕ АБЗАЦЕВ
HTML[12] тег форматирование символ. Текст выводится в окно браузера слово за словом, при достижении правой границы окна очередное слово автоматически переносится на новую строку. Даже если в коде страницы было введено несколько пробелов или текст записывался с новой строки, при просмотре в браузере эти действия отображены не будут. Поэтому чтобы вывести в тексте ряд последовательных пробелов или несколько пустых строк, приходится применять различные теги.
Тег (от английского break) разрывает текстовый поток и вставляет новую строку без образования нового абзаца. Несколько последовательных тегов интерпретируются как несколько пустых строк. Межстрочный интервал одинарный. Закрывающего компонента тег не имеет, как и атрибутов.
Тег (от английского paragraph) начинает абзац; новый абзац отделяется от предыдущего двойным межстрочным интервалом. Абзац пустым быть не может, то есть несколько последовательных тегов интерпретируются как один.
Закрывающий компонент не обязателен, так как предыдущий абзац заканчивается там, где начинается новый. Тег имеет необязательный атрибут ALIGN, указывающий на вид выравнивания абзаца, который может принимать значения LEFT, CENTER, RIGHT и JUSTIFY, задающие выравнивание соответственно по левому краю, центру, правому краю и по ширине.
Если закрывающий компонент опустить, то заданный тип выравнивания сохраняется до следующего тега, задающего выравнивание, или до конца документа.
HTML позволяет создавать форматировать абзацы как нумерованные или маркированные списки. Фрагмент текста, представляющий собой список, заключается в теги:
...
упорядоченный (нумерованный) список (от английского ordered list)
...
неупорядоченный (маркированный) список (от английского unordered list)
Каждый элемент упорядоченного или неупорядоченного списка заключается в теги... (от английского list[13] item). При выводе текста каждый элемент списка будет располагаться с новой строки, обозначенной номером или маркером. Кроме того, у списка может быть заголовок, который задается тегом (от английского listheader). Закрывающие теги и не обязательны.
Многоуровневый список может быть организован посредством комбинации нумерованных и маркированных списков.
Абзацы можно оформить и в виде заголовков уровня (от n=1 до n=6), для этого используют теги вида <Hn>... n>. Заголовок первого уровня выводится наиболее крупным шрифтом.
3.2. РАЗМЕЩЕНИЕ РИСУНКОВ
Изображения, которые демонстрируются браузером при просмотре веб-страницы, хранятся в отдельных файлах формата gif[14], jpg (jpeg) или png, а в коде страницы делается ссылка на нужный файл.
|
Обязательный атрибут: |
||
|
SRC = url |
Адрес графического файла (относительный или абсолютный) |
|
|
Основные необязательные атрибуты: |
||
|
ALT = текст |
Альтернативный текст, выводимый в режиме браузера без загрузки изображений (обязательно заключается в кавычки) |
|
|
BORDER = значение |
Толщина обрамляющей рамки в пикселях, 0 означает отсутствие рамки (по умолчанию) |
|
|
BORDERCOLOR = цвет |
Задает цвет обрамляющей рамки |
|
|
HEIGHT = значение |
Высота изображения в пикселях (по умолчанию оригинальная) либо в процентах от высоты окна браузера |
|
|
WIDTH = значение |
Ширина изображения в пикселях (по умолчанию оригинальная) либо в процентах от ширины окна браузера |
|
|
HSPACE = значение |
Свободное пространство слева и справа от изображения в пикселях |
|
|
VSPACE = значение |
Свободное пространство сверху и снизу от изображения в пикселях |
|
|
ALIGN = значение |
Выравнивание изображения по горизонтали. Если заданы значения LEFT либо RIGHT, изображение соответствующим образом будет выровнено по горизонтали, задание этих значений обеспечивает обтекание изображения текстом |
|
Рассмотрим подробнее абсолютный[15] и относительный способы адресации файла.
Адресация в абсолютной форме используется при ссылках на ресурсы, находящиеся на других серверах. Универсальный адрес, определяющий местонахождение информационного ресурса, носит название URL (Uniform Resource Locator[16] - унифицированный адрес ресурса). URL состоит из двух частей, разделенных двоеточием. Первая часть указывает на тип сетевого протокола, который зависит от типа ресурса. Например, если ресурс располагается на WWW-сервере, это протокол http. Вторая часть включает в себя имя компьютера (сервера) в доменной системе имен и (если требуется) путевое имя файла. При записи путевого имени названия каталогов разделяются прямой косой чертой (символ /), в именах файлов и каталогов различаются прописные и строчные буквы, пробелы не допускаются.
3.3.ГИПЕРССЫЛКИ
Гиперссылкой называют объект (текст, изображение, фрагмент изображения), при щелчке мышью по которому происходит переход к новому документу или фрагменту документа. Именно гиперссылки позволяют организовать переходы между любыми размещенными в сети Интернет документами.
3.4 ТЕКСТОВЫЕ ГИПЕРССЫЛКИ
Связь между HTML-документами и фрагментами документов организуется с помощью тега... (от английского anchor[17] - якорь).
Тег употребляется как для создания ссылки на другой документ, так и для ссылки на фрагмент документа.
|
Обязательный атрибут: |
||
|
HREF = url |
Адрес целевого документа (может быть представлен в абсолютной и относительной форме) |
|
|
Основные необязательные атрибуты: |
||
|
+ |
Помечает находящийся между <A> и A> фрагмент документа как возможный объект для ссылки. В качестве значения нужнолатиницей написать любое слово-указатель, уникальное для данного документа. Например, тег Раздел1 создает так называемую метку (закладку) для перехода к разделу 1. В этом случае можно ссылаться на помеченную область простым указанием ее имени после имени документа (перед именем метки ставится #). Так, <AHREF=«Index. html#part1»>К разделу 1A> отправит вас в раздел «part1» файла Index. html, а <AHREF=«#part2»> К разделу 2 A> ? в раздел «part2» текущего документа при условии, что в документе имеется соответствующая метка |
|
|
TARGET = «имя» |
Имя кадра (фрейма) или окна для вывода целевого документа. Этот атрибут используется только совместно с параметром HREF. В качестве значения необходимо задать либо имя одного из существующих фреймов, либо одно из следующих зарезервированных имен: _self - указывает, что определенный в параметре HREF документ должен отображаться в текущем фрейме; _parent - указывает, что документ должен отображаться во фрейме-родителе текущего фрейма (целиком занять окно браузера) ; _blank - указывает, что документ должен отображаться в новом окне |
|
|
TITLE=«текст» |
Выводит всплывающую подсказку при наведении указателя мыши на гиперссылку |
|
Текст и изображения, размещенные между тегами становятся активной зоной документа, чувствительной к щелчку мыши, который вызывает загрузку целевого документа. Текст гиперссылки выделяется подчеркиванием и цветами, указанными как значение атрибутов LINK, ALINK, VLINK тега (либо цветом по умолчанию).
3.5. ГИПЕРССЫЛКИ-КАРТИНКИ
Чтобы сделать гиперссылкой целое изображение, также применяется тег...., только вместо текста (или вместе с текстом) между <A> и A> располагается тег <IMG…>[18] со всеми соответствующими атрибутами.
3.6. КАРТА ГИПЕРССЫЛОК
Тег позволяет сделать активной зоной текстовый фрагмент или изображение целиком; для того же, чтобы разные фрагменты одного изображения ссылались на разные целевые документы[19], придется использовать тег, реализующий изображение-карту.
У тега-контейнера единственным обязательным атрибутом является NAME, значением которого будет имя (например, NAME[20]=«mymap», которое должно быть использовано при описании атрибута USEMAP тега IMG, описывающего изображение, призванного служить картой (при этом к имени карты приписывается слева # ? USEMAP =«#mymap»)
Внутри контейнера каждой чувствительной к перемещению мыши зоне изображения должен соответствовать тег с атрибутами:
|
Синтаксис [21]атрибута |
Назначение |
|
|
COORDS = список |
Список через запятую координат активной зоны (зависит от типа заданной формы зоны) |
|
|
HREF = url |
Адрес целевого документа гиперссылки, связанного с указанной зоной |
|
|
SHAPE = форма |
Определяет форму активной зоны. Возможные значения этого атрибута: circle (окружность - задается координатами центра и радиусом в пикселях) ; rect (прямоугольник - задается координатами левого верхнего и правого нижнего угла) ; poly (многоугольник - задается координатами своих вершин) Координаты во всех случаях отсчитываются от верхнего левого угла изображения в пикселях, ось Х направлена вправо, ось Y? вниз. |
|
|
NOREF |
иногда бывает нужно указать, что данная зона (заданная атрибутом SHAPE и координатами COORDS) не является активной, реакции на щелчок мыши нет |
|