Язык HTM

Содержание

Введение в язык HTML
Все Web-страницы Интернета имеют одну общую черту — они созданы с помощью средств языка HTML. HTML — не обычный язык программирования, хотя процесс создания Web-страницы очень близок к процессу программирова¬ния. HTML — это язык разметки гипертекста. Он определяет правила, согласно которым обычный текст представляется в виде Web-страниц.
World Wide Web и HTML
Современный этап развития Интернета начался в начале 90-х годов с появ-лением нового протокола обмена информацией. Этот про¬токол называется HTTP (HyperText Transfer Protocol — протокол передачи гипертекста). Вместе с этим протоколом появилась и служба World Wide Web (часто также называе¬мая WWW или просто Web), которая представляет собой обширную сеть серве¬ров HTTP, передающих файлы через Интернет.
Основную часть этих файлов представляют собой Web-страницы – специ-альные файлы, написанные на языке HTML (HyperText Markup Language — язык разметки гипертекста). Web-страницы публикуются, в Интернете путем размещения таких файлов на серверах HTTP (Web-узлах). Содержание Web-страниц может быть разным и посвященным совершенно произвольным темам, но все они используют одну и ту же основу — язык HTML. До¬кументы HTML обычно имеют расширение *.НТМ или *.HTML
Язык HTML появился одновременно со службой World Wide Web и развивался вместе с ней, постепенно вбирая в себя новые черты, которые позволяли создавать все более и более впечатляющие Web-страницы. Он является основой World Wide Web и одновре¬менно причиной ее широчайшей популярности. Смысл и назначе¬ние языка HTML можно понять, исходя из его названия.
Гипертекст — это текст, в который встроены специальные коды, управляющие дополнительными элементами, такими как формати¬рование, иллюстрации, мультимедийные вставки и гиперссылки на другие документы. Под разметкой понимается вставка в текст этих кодов, определяющих то, как итоговый гипертекстовый доку¬мент должен отображаться специальной программой-броузером. Разметка может быть простой или сложной, но в любом случае исходный текст сохраняется в документе в неизменном виде.
Но самое важное слово в этом описании — язык. HTML пред¬ставляет собой компьютерный язык, в некотором смысле родст¬венный языкам программирова¬ния. Он включает достаточно строгие правила, которые необходимо соблюдать, чтобы получить правильные результаты.
Назначение языка HTML
Несмотря на то, что Web-страницы появляются на экране компью¬тера в отформатированном виде, язык HTML не предназначен для форматирования документов, поскольку жесткое задание оформления и точное позиционирование элементов текста на стра¬нице приводит к ограничениям, недопустимым в Интернете.
Так, например, когда мы форматируем текст с помощью тексто¬вого процессора Word, мы однозначно определяем, как должен выглядеть этот текст при печати на совершенно определенном прин¬тере и на бумаге заданного формата. Когда документ размещен в Интернете, невозможно предсказать, какой компьютер будет использован для его просмотра, да и будет ли вообще у этого ком¬пьютера монитор.
Может быть, текст появится на экране компьютера, работающего в системе Windows в окне одного из современных броузеров. Может быть, это будет текстовый броузер (неспособный отображать графику), работающий в системе MS-DOS. Возможно, текст доку¬мента вообще не будет отображаться на экране, а будет воспро¬изводиться вслух с помощью синтезатора речи. Для слепого пользователя документ может выводиться на специальное устрой¬ство шрифтом Брайля.
В связи с необходимостью подготавливать документы для столь разно-образ¬ных устройств язык HTML не предназначен для описа¬ния формата документа. Он служит для функциональной разметки документа, то есть позволяет определить назначение фрагментов текста.
Например, если в тексте встречается заголовок, то код HTML просто указывает, что соответствующий фрагмент является заголовком. Получив такой код, программа просмотра (броузер) сама «решает», что ей делать с заголовком. Возможно, она отобразит его более крупным шрифтом, а может быть выровняет по центру экрана. Возможно, что синтезатор речи, воспроизводящий текст документа, использует код заголовка для того, чтобы повысить громкость и сделать необходимую интонационную паузу.
Язык HTML все-таки имеет некоторые команды форматирования, но общий курс на разделение содержания и оформления документа выдерживается четко. В последней версии HTML- 4.0 использо¬вать команды форматирования, как правило, не рекомендуется.
Теги HTML
Коды языка HTML, с помощью которых выполняется разметка исходного текста, называются тегами. Teг — это набор символов. Все теги начинаются с символа «меньше» (). Пару этих символов иногда называют угловыми скобками. После открывающей угловой скобки идет ключевое слово, определяющее тег.
Каждый тег в языке HTML имеет специальное назначение. Регистр букв в названиях тегов не имеет значения — можно использовать как строчные, так и прописные буквы, хотя общепринято исполь¬зовать прописные буквы, чтобы теги отличались от обычного текста документа.
Как правило, один тег HTML воздействует только на часть доку¬мента, например на абзац. В таких случаях используют парные теги: открывающий и закрывающий. Открывающий тег создает эффект, а закрывающий — прекращает его действие. Закрывающие теги начинаются с символа косой черты (/).
Некоторые теги дают разовый эффект в месте своего появления. В этом случае необходимости в закрывающем теге нет, и он не употребляется.
Если по ошибке в теге указано ключевое слово, отсутствующее в языке HTML, то тег игнорируется целиком.
При отображении документа в броузере сами теги не отображают¬ся, но влияют на способ отображения документа.
Атрибуты тегов
Открывающие теги часто могут содержать атрибуты, влияющие на эффект, создаваемый тегом. Атрибуты — это дополнительные ключевые слова, отде¬лен¬ные от ключевого слова тега и друг от друга пробелами.
Некоторые атрибуты требуют указания значения атрибута. Это значение отделяется от ключевого слова знаком равенства (=). Значение атрибута должно заключаться в кавычки, но во многих случаях эти кавычки могут опускаться без какого-либо вреда. Закрывающие теги никогда не содержат атрибутов.
Примеры использования тегов HTML:


Функциональные разделы документа


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

Текст после горизонтальной линейки разбит на две
строки.



Примеры парных тегов HTML:




Примеры одиночных тегов HTML:

Примеры тегов HTML с атрибутами:
…
…
Лабораторная работа №1
Основные теги HTML
Цель работы научить студентов:
• созданию первичного HTML-документа,
• использованию основных тегов,
• построению простейших HTML-документов.
1.1. Подготовка HTML-документа
Документ HTML состоит из основного текста документа и тегов разметки, которые, как мы уже знаем, являются наборами обычных символов. Таким образом, документ HTML — это, по существу, обычный текстовый файл. Для его создания можно использовать любой текстовый редактор, хотя бы и тот простейший редактор Блокнот, который входит в состав Windows 95/98/2000.
Простейший HTML-документ – это просто текстовый файл с расширением ИМЯ.htm. Можно набрать следующий самый простой HTML-документ в блокноте:

Моя первая страница
Пример 1



Привет!

Это простейший пример HTML-документа.

Этот *.htm-файл может быть одновременно открыт
и в Notepad, и в Internet Explorer. Сохранив изменения в Notepad,
просто нажмите кнопку Обновить в Internet Explorer,
чтобы увидеть эти изменения реализованными в HTML-документе.



Теперь нужно этот текст сохранить на Рабочем столе под именем, напри-мер, PROBA.HTM, далее его нужно закрыть. Для просмотра этого текста как в Интернете, нужно загрузить с рабочего стола снова файл PROBA. HTM. Загру¬зит¬ся этот текст в броузере Internet Explorer.
Результат этого фрагмента HTML-программы на экране:
Моя первая страница
Привет!
Это простейший пример HTML-документа.
Этот *.htm-файл может быть одновременно открыт и в Notepad, и в Internet Explorer. Сохранив изменения в Notepad, просто нажмите кнопку Обновить в Internet Explorer, чтобы увидеть эти изменения реализованными в HTML-документе.

Для изменения исходного текста программы в виде HTML-программы выполните команду Вид – В виде HTML и после каждого изменения нужно выполнить команду Файл – Сохранить.
Далее, чтобы просмотреть эти изменения в броузере нужно перейти в Internet Explorer и выполнить команду Обновить.
Для удобства чтения введены дополнительные отступы, однако в HTML это совсем не обязательно. Более того, броузеры просто игнорируют символы конца строки и множественные пробелы в HTML-файлах. Поэтому наша программа вполне мог бы выглядеть и вот так:
Пример 1 Привет!
Это простейший пример HTML-документа.
Этот *.htm-файл может быть одновременно открыт и в Notepad, и в
Internet Explorer. Сохранив изменения в Блокнот, просто сохраните как
ИМЯ.HTM . Далее закройте и загрузите документ ИМЯ.HTM ,
чтобы увидеть эти изменения реализованными в HTML-документе.

Результат работы на экране:
Привет!
Это простейший пример HTML-документа.
Этот *.htm-файл может быть одновременно открыт и в Notepad, и в Internet Explorer. Сохранив изменения в Блокнот, просто сохраните как ИМЯ.HTM . Далее закройте и загрузите документ ИМЯ.HTM, чтобы увидеть эти изменения реализованными в HTML-документе.
1.2. Теги определения структуры документа HTML
Все документы HTML имеют строго заданную структуру. Доку¬мент должен начинаться с тега и заканчиваться соответ¬ствующим закрывающим тегом . Эта пара тегов сообщает броузеру, что перед ним действи¬тель¬но документ HTML. Тег должен открывать документ и, анало¬гично, метка должна завершать HTML-документ.
Документ HTML состоит из раздела заголовков и тела документа, идущих именно в таком порядке. Раздел заголовков заключен между тегами и и содержит информацию о документе в целом. В частности, этот раздел должен содержать внутри себя теги и , между которыми размещают заголовок документа. Все, что находится между тегами и , толкуется броузером как название документа. Internet Explorer, например, показывает название текущего документа в заголовке окна и печатает его в левом верхнем углу каждой страницы при выводе на принтер.
Сам текст документа располагается в теле документа. Тело документа располагается между тегами и .
Четыре перечисленных парных тега определяют основную структуру документа HTML. Они встречаются (или их наличие подразумевается) во всех документах HTML.
На практике определить местоположение этих основных структур¬ных тегов можно и при их отсутствии. Поэтому, если теги , и , а также соответствующие им закрывающие теги опущены, то программа-броу¬зер может сама определить то место, где они должны были находиться. Тег , определяющий заголовок документа, считается обязательным, но и его пропуск не вызовет катастрофических последствий в современных броузе¬рах. Но все-таки при создании Web-страниц опускать все эти теги не рекомен¬дуется, ведь заранее неизвестно, как поведет себя кон-кретный броузер, установленный на компьютере пользователя.
1.3. Основные теги HTML-документа
Язык HTML предназначен для описания функциональных разде¬лов документа. В большинстве документов основными разделами являются заго-лов¬ки и абзацы.
HTML поддерживает шесть уровней внутренних заголов¬ков документа. Они помечаются тегами от и до и . Заголовок первого уров¬ня – самый крупный, шестого уровня, естественно – самый мелкий. Реально на экране компьютера все эти заголовки изо¬бражаются шрифтами полужирного начертания.
В соответствии с идеологией HTML текст, который действительно является заголовком, следует пометить с помощью одного из этих тегов, В составе языка имеются теги форматирования, изменяющие размер и начертание шрифта, но пользоваться ими в этом случае не рекомендуется.
Для обозначения обычных абзацев в языке HTML используют тег (и соответствующий закрывающий тег ). Теги, опи¬сывающие абзацы, явля-ются необязательными. Однако при наличии этих тегов броузеры четко отсле-живают границы между абзацами.
Теги ... и могут содержать дополнительный атрибут ALIGN (читается "элайн", от английского "выравнивать"), например:
Выравнивание заголовка по центру
или
Образец абзаца с выравниванием по правому краю
В языках программирования общепринята возможность использо¬вания комментариев — текстовых строк, не являющихся частью программы, а служащих для пояснения. Язык HTML тоже имеет такую возможность.
Комментарии в языке HTML начинаются со специального тега . Комментарий может содержать любые символы, кроме символа «больше» (>), и, таким образом, не может включать в себя теги.
В языке HTML нет никаких средств для создания абзацного отступа («красной строки»), поэтому для удобочитаемости текста между абзацами броузер обычно вводит пустую строку. Важным средством создания разделителей в тексте являются горизон¬тальные полоски-линейки, визуально отделяющие разные .....