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

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

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

Возможности HTML

HTML-документ можно составлять в любом редакторе, который есть в операционной системе: Notepad на MS Windows, TextEdit в Mac, Pico на Linux. Браузер для работы HTML–документа желателен, но необязателен. Он нужен для того, чтобы показать отформатированный документ.

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

Что такое теги

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

Что такое гипертекстовый документ. Смотреть фото Что такое гипертекстовый документ. Смотреть картинку Что такое гипертекстовый документ. Картинка про Что такое гипертекстовый документ. Фото Что такое гипертекстовый документ

Тег – это составной элемент, определяющий разметку структурных блоков. Он открывается, и этим начинает свое действие; и закрывается, обозначая завершение команды. Закрытые и открытые теги различаются только слешем перед именем тега. Эти теги создают оболочку, в которую помещается текст.

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

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

Помимо атрибутов в тег можно добавлять вложения, эти элементы могут менять стиль текста. Например, можно выделить какое-то слово жирным шрифтом.

Источник

Основы языка HTML

Прописные и строчные буквы при записи тегов не различаются. В большинстве случаев теги используются парами. Пара состоит из открывающего (start tag ) и закрывающего ( end tag ) тегов. Синтаксис открывающего тега:

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

Атрибуты тега записываются в следующем формате:

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

Каждая из таких зарезервированных последовательностей начинается символом амперсенда (&) и заканчивается точкой с запятой (;).

ПоследовательностьСимвол
символ >
&символ &
«символ » (кавычка)
неразрывный пробел

Структура HTML-документа

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

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

Тело документа

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

Источник

Что такое гипертекст

21 ноября 2017 Опубликовано в разделах: Азбука терминов. 34726

Что такое гипертекстовый документ. Смотреть фото Что такое гипертекстовый документ. Смотреть картинку Что такое гипертекстовый документ. Картинка про Что такое гипертекстовый документ. Фото Что такое гипертекстовый документ

Что такое гипертекстовый документ. Смотреть фото Что такое гипертекстовый документ. Смотреть картинку Что такое гипертекстовый документ. Картинка про Что такое гипертекстовый документ. Фото Что такое гипертекстовый документ

Что такое гипертекстовый документ. Смотреть фото Что такое гипертекстовый документ. Смотреть картинку Что такое гипертекстовый документ. Картинка про Что такое гипертекстовый документ. Фото Что такое гипертекстовый документ

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

Наверняка вы хотя бы раз использовали Википедию. Размещенные в ней статьи — ярчайший пример гипертекстов. Здесь в каждой статье выделены какие-либо термины/понятия/даты/фамилии ученых. Нажав на них, вы переходите на статью, которая уже посвящена им. Также вы можете встретить гипертекст, зайдя на любой сайт. Видите здесь раздел «Главная», «О компании», «Наши работы» и так далее. Все вместе это гипертекст.

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

Из чего состоит гипертекст

Гипертекстовый документ еще принято называть HTML документом. Он включает в себя две части: сам текст (информационный блок, материал, данные, содержимое) и теги — для разметки текста. Они определяют внешний вид, как разместить ссылки и т. д.

Гипертекст может содержать самые различные элементы: табуляции, традиционные буквы и цифры, пробелы, знаки препинания, возвраты, специальные обозначения (@, *, +, = и так далее). Однако лучше отказаться от использования в тексте следующих элементов: знаков > (больше), 29.01.2018 19704

Источник

Введение в HTML


Определение HTML

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

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

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

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

Язык разметки гипертекста позволяет помимо задания ссылок задавать форматирование текста на экране. В HTML задаётся также структура фреймов. Допустимо использовать не только графику и текст, но и видео и звук.

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

Гипертекст для просмотра всегда требует программу-просмотрщик. Браузеры Интернет могут работать помимо режима работы в Интернет ещё и в локальном режиме, подсоединение к Интернет в этом случае не требуется. Наиболее известные браузеры- это Internet Explorer и Netscape Navigator. Для работы с представленной здесь версией HTML (3.2) потребуются версии 3.0 и выше (для приведённых браузеров). Браузеры с другими названиями не придерживаются соответствия номера версии номеру стандарта HTML.

Формат HTML файлов.

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

Подготовка гипертекстовых документов

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

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

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

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

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

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

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

Применение гипертекста

Гипертекст, в основном, используется для представления пользователю статической информации (документов, содержащих ссылки, фреймы, текст и графику), но есть возможность за счёт Интернет-программирования (Java, JavaScript, Visual Basic Script) моделировать процессы, генерировать документы, реагирующие на повторный запуск, на время суток и т.д. Здесь рассматривается только статический HTML.

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

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

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

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

Источник

Книга «Язык гипертекстовой разметки HTML»

ОГЛАВЛЕНИЕ

1. ОСНОВНЫЕ ПОНЯТИЯ HTML

2. СТРУКТУРА HTML-ДОКУМЕНТА

2.1. Раздел документа HEAD

Название документа TITLE

2.2. Раздел документа BODY

2.2.1. Спецификация элемента BODY

2.2.2. Советы по использованию атрибутов тега BODY

2.3.1. Пример простого HTML-документа

2.3.2. Пример использования фонового рисунка

3. ЦВЕТОВЫЕ СПЕЦИФИКАЦИИ

3.2. Символьная нотация

3.3. Соответствие формата RGB и символьной нотации

4. ВЫВОД ТЕКСТОВОЙ ИНФОРМАЦИИ

4.2. Управление переводом строки

4.4.1. Маркированный список

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

4.4.3. Список определений

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

5.1. Универсальный идентификатор ресурсов URL

5.2. Правила записи ссылок

5.3. Внутренние ссылки

5.4. Ссылки на документы различных типов

5.5. Ссылки на ресурсы Интернета

6. ГРАФИЧЕСКИЕ ЭЛЕМЕНТЫ

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

ВВЕДЕНИЕ

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

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

1. ОСНОВНЫЕ ПОНЯТИЯ HTML

HTML – язык гипертекстовой разметки документов (HyperText Markup Language). С помощью HTML создаются Web-страницы, которые находятся в глобальной компьютерной сети Интернет. HTML – это не язык программирования в традиционном смысле, он является языком разметки. С помощью HTML текстовый документ разбивают на блоки смысловой информации (заголовки, параграфы, таблицы, рисунки и т.п.).

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

1. HTML-документ может содержать текст, графику, видео и звук.

3. Создавать HTML-документ можно как с помощью специальных программ – редакторов HTML (например, FrontPage), так и с помощью любого текстового редактора (например, блокнота Windows).

4. Для просмотра HTML-документов существуют специальные программы-броузеры. Они интерпретируют HTML-документы, т.е. переводят текст документа в Web-страницу, и отображают ее на экране пользователя. Существует очень много различных броузеров, но наиболее распространенными броузерами являются Microsoft Internet Explorer, Netscape Navigator и Opera.

5. Если при интерпретации HTML-документа броузер чего-то не понимает, то сообщения об ошибке не возникает, а это место в HTML-документе игнорируется и не отображается броузером.

HTML-документ состоит из элементов HTML.

Элемент HTML – это чаще всего два тега (открывающий и закрывающий) и часть документа между ними. Кроме того, существуют элементы HTML, состоящие только из одного тега.

Тег – в переводе с английского – ярлык, этикетка. Тег определяет тип выводимого элемента HTML (например, заголовок, таблица, рисунок и т.п.). Сам тег не отображается броузером. Тег представляет собой последовательность элементов:

· символ левой угловой скобки ( )

Атрибуты – необязательный набор параметров, определяющих дополнительные свойства элемента HTML (например, цвет или размер). Атрибут
состоит:

· значения атрибута – строки символов, заключенной в кавычки

Пример элемента HTML:

Глава 1


– открывающий тег

ALIGN= «CENTER» – атрибут

ALIGN – имя атрибута

«CENTER» – значение атрибута

Глава 1 – содержание элемента HTML

Правила создания HTML-документов:

1. Теги и атрибуты можно записывать в любом регистре, т.е.

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

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

Контрольные вопросы

1. Дайте понятия элемента HTML, тега, атрибутов.

2. Что такое броузер и интерпретация?

3. Каковы особенности и правила HTML-документа?

2. СТРУКТУРА HTML-ДОКУМЕНТА

Также в HTML-документе должны присутствовать элементы HEAD (информация о документе) и BODY (тело документа).

2.1. РАЗДЕЛ ДОКУМЕНТА HEAD

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

Название документа TITLE

2.2. РАЗДЕЛ ДОКУМЕНТА BODY

2.2.1. Спецификация элемента BODY

Атрибут TEXT задает цвет шрифта для всего документа в формате RGB или в символьной нотации. По умолчанию (если не указан этот атрибут) используются настройки броузера.

Атрибут BGCOLOR задает цвет фона окна броузера документа в формате RGB или в символьной нотации. По умолчанию используются настройки броузера.

Атрибут BACKGROUND позволяет указать адрес и имя рисунка, используемого в качестве фона. Этот рисунок будет размножен и распределен на заднем плане документа.

Атрибуты LINK, VLINK и ALINK задают цвета гиперссылок в формате RGB или в символьной нотации. По умолчанию используются настройки броузера. Непосещенная гиперссылка – гиперссылка, которая еще не использовалась для перехода к другому документу. Посещенная гиперссылка – гиперссылка, которая уже использовалась для перехода к другому документу. Активная гиперссылка – гиперссылка на документ, к которому в данный момент происходит переход.

2.2.2. Советы по использованию атрибутов тега BODY

· Если вы указываете хотя бы один цвет в теге BODY, то укажите и остальные. Это связано с тем, что пользователь может установить настройки цветов своего броузера как ему удобней. Указание только одного цвета может привести к ситуации, что у некоторых пользователей текст сольется с цветом фона. В результате просмотр документа будет затруднен.

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

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

2.3. ПРИМЕРЫ

2.3.1. Пример простого HTML-документа

Что такое гипертекстовый документ. Смотреть фото Что такое гипертекстовый документ. Смотреть картинку Что такое гипертекстовый документ. Картинка про Что такое гипертекстовый документ. Фото Что такое гипертекстовый документ

Этот документ отобразится в броузере так:

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

2.3.2. Пример использования фонового рисунка

Что такое гипертекстовый документ. Смотреть фото Что такое гипертекстовый документ. Смотреть картинку Что такое гипертекстовый документ. Картинка про Что такое гипертекстовый документ. Фото Что такое гипертекстовый документ

Этот документ отобразится в броузере так:

Контрольные вопросы

1. Какие элементы HTML входят в обязательную структуру HTML-документа?

2. Для чего используется элемент BODY и какие он имеет атрибуты?

3. ЦВЕТОВЫЕ СПЕЦИФИКАЦИИ

Для определения цвета различных элементов HTML-документа необходимо указать значение соответствующих атрибутов. Указывать значения этих атрибутов можно двумя способами:

· определять цвет в формате RGB;

· определять цвет, используя символьную нотацию

3.1. ФОРМАТ RGB

Формат RGB – это система указания цвета, которая базируется на смешении трех основных цветов: красном (RED), зеленом (GREEN) и синем (BLUE). Итоговый цвет определяется цифрами в шестнадцатеричном коде. Для каждого цвета задается шестнадцатеричное значение в пределах от 0 до FF, что соответствует диапазону 0-255 в десятичном исчислении. Затем эти значения объединяются в одно число, перед которым ставится символ #. Например, число #800080 обозначает фиолетовый цвет. Указывая цвет в формате RGB, можно определить более шестнадцати миллионов цветовых оттенков.

3.2. СИМВОЛЬНАЯ НОТАЦИЯ

Задание цвета в формате RGB имеет один недостаток – необходимо помнить совокупности цифр для указания цвета. Этого недостатка лишена символьная нотация. Можно указывать название цвета на английском языке. Но у этого способа указания цвета тоже есть недостаток – определено всего шестнадцать имен цветов.

3.3. СООТВЕТСТВИЕ ФОРМАТА RGB И СИМВОЛЬНОЙ НОТАЦИИ

Ниже приведена таблица соответствий указания цвета в символьной нотации и формате RGB.

Символьная нотация

Формат RGB

Цвет

Таким образом, строка TEXT=»#008000″ и строка TEXT=»Green» в теге одинаково определяют цвет шрифта – зеленый.

Контрольные вопросы

1. Чем отличается символьная нотация от формата RGB?

2. Какие значения в символьной нотации можно использовать для указания цвета?

4. ВЫВОД ТЕКСТОВОЙ ИНФОРМАЦИИ

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

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

4.1. АБЗАЦЫ

Атрибут ALIGN определяет способ выравнивания абзаца. Он может иметь следующие значения:

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

· CENTER – текст выравнивается по центру окна броузера.

· RIGHT – текст выравнивается по правому краю окна броузера.

Пример использования тега

Этот документ отобразится в броузере так:

Что такое гипертекстовый документ. Смотреть фото Что такое гипертекстовый документ. Смотреть картинку Что такое гипертекстовый документ. Картинка про Что такое гипертекстовый документ. Фото Что такое гипертекстовый документ

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

4.2. УПРАВЛЕНИЕ ПЕРЕВОДОМ СТРОКИ

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

Что такое гипертекстовый документ. Смотреть фото Что такое гипертекстовый документ. Смотреть картинку Что такое гипертекстовый документ. Картинка про Что такое гипертекстовый документ. Фото Что такое гипертекстовый документ

Этот пример будет выглядеть так:

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

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

Это стихотворение написал – великий русский поэт.

В броузере участок текста “А.С. Пушкин” всегда будет отображаться на одной строке.

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

4.3. ЗАГОЛОВКИ

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

Синтаксис тегов заголовков:

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

Пример использования разных заголовков:

Заголовок 1


Заголовок 2

Что такое гипертекстовый документ. Смотреть фото Что такое гипертекстовый документ. Смотреть картинку Что такое гипертекстовый документ. Картинка про Что такое гипертекстовый документ. Фото Что такое гипертекстовый документ

Вот так броузер отобразит данный пример:

4.4. СПИСКИ

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

4.4.1. Маркированный список

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

Спецификация элемента UL:

Атрибут TYPE задает вид маркера, которым выделяются элементы списка. Он может имеет следующие значения:

· DISK – маркеры отображаются закрашенными кружочками, это значение используется по умолчанию;

· CIRCLE – маркеры отображаются не закрашенными кружочками;

· SQUARE – маркеры отображаются квадратиками.

Спецификация элемента LI для маркированного списка:

Атрибут TYPE задает вид маркера, он может принимать такие же значения, что и одноименный атрибут элемента UL. Значение по умолчанию – DISK.

Пример использования маркированного списка:

Крупные города России:

Вот так броузер отобразит данный пример:

Что такое гипертекстовый документ. Смотреть фото Что такое гипертекстовый документ. Смотреть картинку Что такое гипертекстовый документ. Картинка про Что такое гипертекстовый документ. Фото Что такое гипертекстовый документ

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

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

Спецификация элемента OL:

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

· A – маркеры в виде прописных латинских букв;

· a – маркеры в виде строчных латинских букв;

· I- маркеры в виде больших римских цифр;

· i- маркеры в виде маленьких римских цифр;

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

Атрибут START определяет позицию, с которой начинается нумерация списка. Используя этот атрибут, можно начать нумерацию, например, с цифры 5 или буквы E, в зависимости от вида нумерации. Значением атрибута START является число, вне зависимости от вида нумерации.

Спецификация элемента LI для нумерованного списка:

Атрибут TYPE задает вид нумерации, он может принимать такие же значения, что и одноименный атрибут элемента ОL. По умолчанию значение этого атрибута – 1.

Атрибут VALUE позволяет изменить номер данного элемента, при этом изменятся номера и последующих элементов.

Пример использования нумерованного списка:

Города России по величине:

Вот так броузер отобразит данный пример:

Что такое гипертекстовый документ. Смотреть фото Что такое гипертекстовый документ. Смотреть картинку Что такое гипертекстовый документ. Картинка про Что такое гипертекстовый документ. Фото Что такое гипертекстовый документ

4.4.3. Список определений

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

Пример использования списка определений:

Пример списка определений

Состав Microsoft Office

Многофункциональный текстовый процессор

Программа для работы с электронными

Система управления базами данных

Этот пример отобразится в броузере так:

Что такое гипертекстовый документ. Смотреть фото Что такое гипертекстовый документ. Смотреть картинку Что такое гипертекстовый документ. Картинка про Что такое гипертекстовый документ. Фото Что такое гипертекстовый документ

4.5. ФОРМАТИРОВАНИЕ ТЕКСТА

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

Это полужирный шрифт

Тег отображает текст курсивом. Например:

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

Пример подчеркивания текста

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

Пример зачеркивания текста

Тег выводит текст шрифтом большего (чем непомеченная часть текста) размера. Например:

Шрифт большего размера

Тег выводит текст шрифтом меньшего размера. Например:

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

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

Шрифт нижнего индекса

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

Шрифт верхнего индекса

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

Этот текст полужирный и

Что такое гипертекстовый документ. Смотреть фото Что такое гипертекстовый документ. Смотреть картинку Что такое гипертекстовый документ. Картинка про Что такое гипертекстовый документ. Фото Что такое гипертекстовый документ

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

4.5.1. Тег

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

Атрибут FACE служит для указания типа шрифта, которым броузер будет выводить текст (если такой шрифт имеется на компьютере). Значением данного атрибута служит название шрифта, которое должно в точности совпадать с названием шрифта, имеющимся у пользователя. Если такой шрифт не найдется, то данное указание проигнорируется и будет использован шрифт, установленный по умолчанию.

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

Атрибут COLOR устанавливает цвет шрифта. Значение этого атрибута может быть указано в формате RGB или символьной нотацией.

Пример использования тега :

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

Шрифт по умолчанию

другая форма шрифта

размер увеличен на 1

Этот пример отобразится так:

Что такое гипертекстовый документ. Смотреть фото Что такое гипертекстовый документ. Смотреть картинку Что такое гипертекстовый документ. Картинка про Что такое гипертекстовый документ. Фото Что такое гипертекстовый документ

4.5.2. Контейнер DIV

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

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

4.5.3. Отступы

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

Контрольные вопросы

1. Чем отличаются абзацы от заголовков?

2. Какие бывают списки?

3. Какие теги используются для изменения шрифта?

5. ГИПЕРССЫЛКИ

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

Каждая ссылка состоит из двух частей. Первая – это то, что отображается броузером. Она называется указателем ссылки. Вторая часть – адресная, содержащая адрес объекта, к которому должен происходить переход. Эту часть называют URL (универсальный идентификатор ресурсов).

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

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

5.1. УНИВЕРСАЛЬНЫЙ ИДЕНТИФИКАТОР РЕСУРСОВ URL

По своей сути URL – это адрес файла, к которому происходит переход. Указание адреса может быть относительным или абсолютным.

Когда в URL указывается полный путь к файлу, независимо от того, где этот файл находится (в Интернете или на жестком диске компьютера), то это абсолютное указание. Например:http://www.mysite.ru/page.htm – абсолютный адрес документа, находящегося в Интернете, c:\web\doc1.htm – абсолютный адрес документа на диске c.

Если в URL указывается не полный путь, а путь относительно адреса документа, в котором находится ссылка, то это относительное указание. Например, броузер отображает документ, абсолютный адрес которого c:\web\doc1.htm, в этом документе имеется ссылка с адресом pict/ris1.jpg, то это означает, что на самом деле ссылка будет на документ по адресу c:\web\pict\ris1.jpg.

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

5.2. ПРАВИЛА ЗАПИСИ ССЫЛОК

TARGET=»объект для вывода»

Атрибут HREF используется для задания адреса файла, к которому производится переход. Значением этого атрибута является текстовая строка, содержащая абсолютный или относительный URL-адрес.

Атрибут NAME предназначен для задания ссылке имени. Значением этого атрибута является короткая текстовая строка. Этот атрибут используется для ссылок внутри одного HTML-документа.

Атрибут TARGET позволяет определить, куда будет выводиться документ, на который происходит переход. Этот атрибут может иметь значение _blank – это означает, что документ будет выводиться в новом окне броузера.

Броузер отобразит эту строку так:

При нажатии мышью на этой строке броузер загрузит и отобразит файл doc1.htm, т.е. “Документ 1” – это указатель ссылки, а “doc1.htm” – URL-адрес.

5.3. ВНУТРЕННИЕ ССЫЛКИ

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

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

После того как место назначения определено, можно приступить к созданию ссылки на него. Для этого в атрибуте HREF тега помещается имя ссылки с префиксом #, говорящим о том, что это внутренняя ссылка.
Например:

Теперь, если пользователь щелкнет кнопкой мыши на словах “Глава 5”, то броузер выведет соответствующую часть документа в окне просмотра.

Можно совмещать внутренние ссылки со ссылками на другие документы. Например:

При нажатии на эту ссылку броузер откроет файл doc1.htm, найдет в этом файле указатель glava5 и выведет в окне просмотра соответствующую
информацию.

5.4. ССЫЛКИ НА ДОКУМЕНТЫ РАЗЛИЧНЫХ ТИПОВ

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

· Броузер знает этот тип документа и умеет с ним обращаться. Например, если создать ссылку на графический файл формата GIF и щелкнуть мышью на ней, то броузер очистит окно просмотра и отобразит указанное изображение.

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

5.5. ССЫЛКИ НА РЕСУРСЫ ИНТЕРНЕТА

Основное назначение HTML-документов – это глобальная компьютерная сеть Интернет. HTML-документ, размещенный в Интернете, становится Web-страницей. Чтобы обратиться к Web-странице, надо указать URL-адрес в такой форме: http://sitename/docname, где sitename – имя сайта, docname – имя документа. Например: http://kotoz.newmail.ru/autor.htm.

Можно на Web-странице разместить адрес электронной почты. Для этого URL-адрес указывается так: mailto:address, где address – это адрес почтового ящика. Например: mailto:vasya@mail.ru.

Также существуют специальные форматы URL-адреса для других ресурсов Интернета (FTP, TelNet, Newsgroup, Gopher, WAIS).

Контрольные вопросы

2. Что такое внутренняя ссылка и как она создается?

3. На какие файлы можно ссылаться в HTML-документах?

6. ГРАФИЧЕСКИЕ ЭЛЕМЕНТЫ

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

6.1. ГОРИЗОНТАЛЬНЫЕ ЛИНИИ

Горизонтальные линии визуально подчеркивают законченность той или иной области документа. Сейчас часто используют рельефную, вдавленную линию, чтобы обозначить “объемность” документа.

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

Атрибут ALIGN определяет способ выравнивания линии. Он может иметь следующие значения:

· LEFT – линия выравнивается по левому краю окна броузера. Это значение используется по умолчанию.

· CENTER – линия выравнивается по центру окна броузера.

· RIGHT – линия выравнивается по правому краю окна броузера.

Атрибут WIDTH задает длину линии. Значением данного атрибута является число. Это число означает длину линии в пикселях. Если после числа стоит знак %, то это означает длину в процентах от ширины окна. Например:

– линия длиной 400 пикселей.

– линия длиной 50 процентов от ширины окна.

Атрибут SIZE задает толщину линии. Значением этого атрибута является число. Это число означает толщину линии в пикселях.

Атрибут NOSHADE отменяет “трехмерность” линии.

6.2. ТАБЛИЦЫ

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

Источник

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

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