Методические указания1_2 (1084715), страница 2
Текст из файла (страница 2)
Заголовок 2
Заголовок 3
Заголовок 4
Заголовок5
Заголовок 6
Рис. 2.1. Заголовки, создаваемые при помощи элементов Н1...Н6.
Шрифт второго заголовка переопределен
Элемент STYLE, введенный сравнительно недавно, вызывает ассоциации с программами для Windows, так как в них впервые появилось стилевое оформление текста, которое теперь невероятно популярно, и без него уже немыслима работа в таких приложениях, как Word или Excel.
<МЕТА>
Этот элемент содержит служебную информацию, которая не отражается при просмотре Web-страницы. Внутри него нет текста в обычном понимании, поэтому нет и конечного тега. Каждый элемент МЕТА содержит два основных атрибута, первый из которых определяет тип данных, а второй — содержание. Вот несколько примеров meta-данных.
• Дата, обозначающая «срок годности» документа:
name="Expires" content="Дата"
• Адрес электронной почты:
name="Reply-to" content="Имя@Адрес"
• Имя автора Web-страницы:
name ="Author" content=" Имя автора"
• Набор ключевых слов для поиска:
name="Keywords" content=" слово1, слово2, словоЗ ..."
• Краткое описание содержания Web-страницы:
name="Description" content="Содержание страницы"
• Описание типа и характеристик Web-страницы:
name="Content-Type" сопtепг="0писание страницы"
• Указание приложения, в котором была создана Web-страница:
name="Generator" content="Название HTML-редактора"
Здесь и далее при описании элементов и их атрибутов курсивом выделены фрагменты, которые должны быть заполнены пользователем по его усмотрению. Атрибут name используется приложением-клиентом для получения дoпoлнитeльнoй информации о Web-страницах и их упорядочения. Этот атрибут часто заменяют атрибутом http-equiv. Он используется сервером для создания дополнительных полей при выполнении запроса.
Кроме этого, элемент МЕТА может содержать URL. Шаблон соответствующего атрибута таков:
URL="http://адрес
<BODY> </body>
Этот элемент заключает в себе гипертекст, который определяет собственно Web-страницу. Это та произвольная часть документа, которую разрабатывает автор страницы и которая отображается браузером. Соответственно, конечный тег этого элемента надо искать в конце HTML-файла. Внутри элемента BODY можно использовать все элементы, предназначенные для дизайна Web-страницы. Внутри начального тега элемента BODY можно расположить ряд атрибутов, обеспечивающих установки для всей страницы целиком. Рассмотрим их по порядку.
Один из самых полезных для дизайна — атрибут, определяющий фон страницы. Его появление можно уподобить маленькой революции в WWW, так как одинаково серые Web-страницы вдруг расцвели яркими цветными узорами:
background="Путь к файлу фона" Более простое оформление фона сводится к заданию его цвета:
bgcolor="#RRGGBB"
Цвет фона задается тремя двуразрядными шестнадцатеричными числами, которые определяют интенсивность красного, зеленого и синего цветов соответственно. Более подробно о задании цветов будет рассказано ниже.
Оба приведенных выше атрибута не являются альтернативными и часто используются совместно: если по каким-либо причинам не может быть найден рисунок фона, используется цвет.
Поскольку фон страницы может изменяться, необходимо иметь возможность подбирать соответствующий цвет текста. Для этого имеется следующий атрибут:
text="#RRGGBB" .
Для задания цвета текста гиперссылок используется следующий атрибут:
link="#RRGGBB"
Точно так же можно задать цвет для просмотренных гиперссылок:
vlink="#RRGGBB"
Можно также указать изменение цвета для последней выбранной пользователем гиперссылки:
alink="#RRGGBB"
Гипертекст, расположенный внутри элемента BODY, может иметь произвольную структуру. Ее определяют, в первую очередь, назначение Web-страницы и фантазия разработчика.
<!-- Комментарий -->
В любом языке программирования есть конструкции, позволяющие создавать произвольные ремарки. HTML в этом смысле — не исключение. Текст, введенный внутри этого элемента, игнорируется браузером. Эти элементы могут располагаться в любом месте Web-страницы. Без закрывающей угловой скобки здесь, по-видимому, не обойтись: комментарий должен быть отделен от основного текста. Признаком комментария служит восклицательный знак, а текст комментария должен обрамляться двойными дефисом. Например:
<!-- Начало вывода таблицы -->
<Hl></hl>
Элемент заголовка. Существует шесть уровней заголовков, которые обозначаются Н1...Н6. Заголовок уровня 1 самый крупный, а уровень 6 обеспечивает самый маленький заголовок. Рис. 2.1 дает представление об относительных размерах букв в заголовках. Для заголовков можно использовать атрибут, задающий выравнивание влево, по центру или вправо:
allgn="left" align="center" align="right"
<HR>
Горизонтальная линия (horizontal rule) — очень часто используемый элемент. Во-первых, потому что с его помощью очень удобно делить страницу на части. Во-вторых, потому что выбор подобных элементов оформления у автора страницы очень небольшой. Действительно, в HTML практически отсутствуют похожие конструкции, только для горизонтальной линии почему-то было сделано исключение. Правда, несмотря на некоторую скупость языка в этой области, можно придумать немало стандартных графических образов, которые разнообразили бы вид страниц.
Элемент не имеет конечного тега, но допускает ряд атрибутов для выравнивания влево, по центру, вправо, по ширине:
align="left"
align="center"
align="right"
align="justify"
Можно задавать толщину линии:
size=толщина в пикселах
Можно управлять длиной линии:
width =длина в пикселах
width= длина в процентах%
Можно выбрать цвет:
color="цвет"
<A> </a>
HTML-документ может быть очень большим, и в этом случае пользователю должна быть предоставлена возможность быстрого перемещения к нужному разделу документа. Для этого можно использовать механизм гиперссылок. Необходимо также в нужных местах текста расставить соответствующие метки. Подробно гиперссылкп обсуждаются в разделе «Гиперссылки» главы 3, а здесь мы рассмотрим только шаблон для создания меток:
<А name="метка">Произвольный текст</а>
В этом случае данной строке документа присваивается имя, и, следовательно, в другой части документа или даже на другом документе может быть создана гиперссылка, приводящая в эту точку.
Например, для перехода внутри документа можно использовать следующую конструкцию:
<Р>Переход к <А href="#метка">метке</а></p>
Несколько подобных строк могут образовать своеобразное оглавление Web-страницы, которое можно разместить в начале и в конце документа.
<BASE>
Элемент для задания базового адреса (URL) для ссылок. Это позволяет опускать начальную часть адреса в ссылках документа. Для использования этого элемента необходимо использовать следующую конструкцию:
<BASE href="http:///<компьютер/путь1">
Фрагмент адреса путъ1 не является обязательным. При формировании полного адреса он будет отброшен. Так, если в тексте документа встретится относительная ссылка
<А href ="путь2/имя документа. htm">Видимый текст ссылки</а>,
то она будет соответствовать URL
http://компьютер/путь2/имя документа.htm
В том случае, когда надо задать базовый адрес для локального диска (например, D:), должна быть использована такая конструкция:
<BASE href="file://D:\путь\">
Тогда при указании относительной ссылки можно будет задавать не только имя файла, но и имена папок, в которых он находится. Иными словами, путь к файлам может быть разбит на две части: абсолютную и относительную. Это полезно в том случае, когда для файлов, указанных в документе, есть общий начальный фрагмент пути.
В выражении абсолютной ссылки можно также опустить указание на схему доступа (file: //). В этом случае будет учитываться только левая часть абсолютной ссылки до первого левого символа "\", то есть имя локального диска.
2.2. Правила синтаксиса
Теперь, когда мы знаем, как выглядит код Web-страницы, можно сделать некоторые обобщающие выводы относительно синтаксиса HTML. При использовании каждого элемента важно знать, какие элементы могут располагаться внутри него и внутри каких элементов может находиться он сам. Так, взаимное расположение элементов HTML, HEAD, TITLE и BODY должно быть стандартным на любой странице, правда, в тех случаях, когда не используются фреймы. Если же страница представляет собой документ планировки фреймов (подробнее об этом в разделе «Фреймы» главы 3), то вместо элемента BODY используется элемент FRAMESET.
Существуют группы элементов, которые используются совместно. К ним относятся элементы для создания таблиц, списков, фреймов. В этом случае порядок вложения элементов определяется логикой создания того или иного объекта на странице: тут надо помнить несложные правила конструирования. Таблицы и фреймы часто используются для того, чтобы разместить детали страницы (рисунки, текст и т. д.) в определенном порядке. Например, располагая рисунок внутри ячейки таблицы, можно добиться определенного его положения. В таких случаях вложенность элементов определяется разработчиком Web-страницы, и многое зависит от его фантазии и умения.
Большое количество элементов, которые используются для форматирования текста, допускают самые разнообразные варианты вложения. И сами они обязательно должны располагаться внутри определенных элементов. Здесь надо руководствоваться здравым смыслом: каждый элемент выполняет заданную функцию и имеет определенную область действия.
В приведенном ниже примере есть два абзаца (первый в зеленой рамке) и таблица:
<Р style="border: Зрх solid gгееп">Текст абзаца 1</р>
<TABLE> ... </table>
<Р> Текст абзаца 2</p>
Таблица в данном случае — независимый элемент. Ее можно, например, выравнивать независимо от остального текста. Можно использовать другой код:
<Р style="border: Зрх solid gгееп">Текст абзаца 1
<TABLE> ... </table>
<Р> Текст абзаца 2</р>
Исчез конечный тег первого абзаца. Теперь таблица является частью первого абзаца, и зеленая рамка будет охватывать таблицу и текст. И наоборот, элемент P может находиться внутри таблицы: например, один элемент ячейки TD может содержать несколько абзацев Р. Нарушение правил вложения — одна из наиболее распространенных ошибок при создании Web-страниц. Чтобы избежать таких ошибок, надо пользоваться редакторами гипертекста, которые автоматически контролируют выполнение правил синтаксиса. Ниже приведена строка, содержащая типичную ошибку вложения элементов:
<Н1>Заголовок 1 <Н2> Заголовок 2 </h1> Заголовок 3 </h2>
Надо заметить, что браузеры построены таким образом, что они «стараются» не реагировать на ошибки разметки гипертекста. Если страница может быть отображена, то она выводится на экран без каких-либо предупреждающих сообщений. Программа интерпретирует ошибочно расставленные теги определенным образом и формирует изображение, следуя логике, заложенной в нее разработчиками. При этом вид страницы может и не соответствовать замыслу автора. И только в случае очень серьезных ошибок или явных противоречий браузер выводит сообщение о невозможности отобразить страницу. Косвенным признаком ошибки разметки может служить появление на странице фрагментов кода HTML. Пользователи, много работающие с Интернетом, наверняка сталкивались с такой ситуацией.
Правила синтаксиса распространяются и на использование стартового и конечного тегов, атрибутов и содержимого элемента. Не путайте понятия «элемент» и «тег». Элемент — это контейнер, содержащий атрибуты внутри стартового тега и полезную информацию между стартовым и конечным тегами. Тег — это конструкция, заключенная в угловые скобки и используемая для обозначения области действия элемента.
Некоторые элементы не имеют конечного тега. Очевидно, что элементу BR, обозначающему конец строки, не нужен конечный тег. Некоторые элементы могут использоваться с конечным тегом или без него. Самым ярким примером служит элемент абзаца Р. Он может иметь конечный тег, но если этот тег не задан, то признаком окончания действия элемента служит следующий элемент, который может логически определить конец текущего абзаца: другой элемент P, элемент рисунка IMG, элемент списка UL, элемент таблицы TABLE и т. д.
Таким образом, полезная информация одного элемента должна находиться или между начальным и конечным тегами данного элемента, или между начальным тегом данного и начальным тегом следующего элемента. Любой произвольный текст, введенный на страницу, воспринимается браузером как подлежащий выводу на экран и, следовательно, форматированию в соответствии с окружающими этот текст элементами. При этом не учитывается разбиение текста на строки, полученное в текстовом редакторе. Теоретически, всю Web-страницу можно уместить в одной длинной строке. Символы конца строки, введенные, например, в Блокноте, могут помочь чтению кода HTML, но не отображаются браузером. Последний, при выводе страницы на экран, может оборвать строку в соответствии с расстановкой элементов Hn, P или BR, а в остальных случаях он форматирует абзацы произвольно, в зависимости от объема текста, размера шрифта и текущего размера окна. Поэтому Web-страницы надо компоновать таким способом, чтобы их вид кардинально не изменялся для разных режимов разрешения монитора, размера экрана, размера окна броузера, а также для полноэкранного или оконного режимов.
Очень важным правилом, которое не имеет исключений, является размещение атрибутов элемента внутри начального тега.
2.3. Кодирование символов
Нет нужды доказывать, что основным языком Интернета является английский. В то же время для гипертекстовых документов предусмотрено использование национальных алфавитов. Стандартным режимом отображения является кодировка ISO Latin I (ISO 8859-1). Она подходит как для MS-DOS (набор символов ASCCII), так и для Windows, поэтому набор программ для просмотра и редактирования кода HTML, достаточно широк. В то же время браузеры поддерживают набор символов Unicode 2.0 (IS010646), что позволяет использовать национальные алфавиты. С практической точки зрения это означает, что символы могут кодироваться однобайтовым числом (коды в пределах 0-255) или двубайтовым (0-65 535). В первом случае для использования национального алфавита необходим атрибут charset (См. листинг 1.1), так как одни и те же коды символов могут быть интерпретированы по-разному для различных кодовых страниц.
А как быть, если атрибут charset не указан? Раскройте в MSIE подменю Вид кодировки меню Вид и проверьте, какие кодовые страницы доступны на вашем компьютере. Наверняка вы найдете команды, отвечающие за отображение русских букв: Кириллица (Windows) и/или Кириллица (КОИ8-Р). Это две наиболее популярные в нашей стране кодировки. Самый простой вариант, когда для Web-страницы не указана ни кодовая страница, ни конкретные шрифты. Тогда браузер будет использовать шрифты, выбранные по умолчанию. Поскольку каждый пользователь настраивает программу для себя и применяет шрифты с национальными алфавитами, то с отображением отечественных ресурсов проблем обычно не возникает. Русский будет читать русские, а немец — немецкие тексты. Если страница загружается из Интернета, то проблема тоже может быть решена: браузер анализирует текст страницы и пытается подобрать необходимую кодировку. Если он делает это неправильно, пользователь всегда может применить упомянутую выше команду и исправить положение.
![](https://s.studizba.com/z.php?f=/templates/si/i/noavatar.png&w=100&h=100&t=1"){kind=avatar}
