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

31.05.2019

Флешка

Кроме рассмотренных способов форматирования, также имеется так называемое логическое форматирование текста.

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

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

..-контейнер для цитат. При этом текст выделяется курсивом.

..- контейнер для программного кода

..- контейнер для определений терминов

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

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

..- контейнер для примеров чего-либо

.. контейнер для текста, который необходимо выделить.

.. контейнер для имён переменных

Тег предварительного форматирования

Данный тег отображает текст заключённый внутри него, так как он выглядит в исходном коде, т.е. в блокноте.

этот текст будет отображен в окне броузера так, как он написан здесь

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

Самостоятельная работа

Задание :

1. Перепишите способы форматирования в отчет.

2. Оформите сайт, используя атрибуты тега , проверьте, как работают атрибут тега

И тег < CENTER> и запишите в отчет результаты.

3. Добавьте в сайт несколько заголовков разной величины и запишите в отчет их действие.

4. В окне сайта отобразите несколько раз формулу X 0 =y 2 +3.

5. Отредактируйте свою страницу используя тег и вставку специальных символов.

6. Проверьте работу тегов логического форматирования.

7. Приложите к отчету листинг готового html-документа.

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

Использование объектов

Цель: освоить теги html, синтаксис языка

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

Ход работы

Атрибуты тега

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

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

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

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

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

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

Атрибут alink определяет цвет активной гиперссылки, который она принимает с момента нажатия на нее курсором до момента загрузки вызываемого ею ресурса. По умолчанию данный атрибут также имеет значение "purple".

Списки

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

· Вхождение 1

· Вхождение 2

· Вхождение 3

На языке HTML подобный список можно представить при помощи команды

Вхождение 1

Вхождение 2

Вхождение 3

Атрибут type позволяет программисту управлять буллет-стилем (т.е.внешним видом) и формой обозначающих каждое вхождение меток. Параметр этого атрибута может принимать одно из трех значений:

Disc - метки в виде окружностей, заполненных черным цветом

Circle - в виде полых окружностей

Square - в виде квадратов, заполненных черным цветом.

По умолчанию type= "Disc"

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

Вхождение 1

Вхождение 2

Вхождение 3

Атрибут type может принимать одно из следующих значений:

"1" - обычные арабские цифры 1,2,3 и т.д.

"I" - римские цифры в заглавном регистре I, II, III, IV и т.д.

"i" - римские цифры в строчном регистре i, ii, iii и т.д.

"А" - символьная маркировка в заглавном регистре А, В, С и т.д.

"а" - символьная маркировка в строчном регистре a, b, c и т.д.

Атрибут start позволяет задать позицию, с которой следует начать маркировку. Например, если ввести type= "1" start="5", то нумерация начнется с цифры 5. Если ввести type= "А" start="D", то маркировка начнется с символа D.

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

Возможно создание так называемых вложенных списков, реализуемых посредством размещения одной пары тегов в другой. Например, для создания списка:

1. Вхождение 1

· Вхождение 1-а

· Вхождение 1-б

2. Вхождение 2

· Вхождение 2-а

· Вхождение 2-б

Введем следующий набор команд

Вхождение 1

Вхождение 1-а

Вхождение 1-б

Вхождение 2

Вхождение 1-а

Вхождение 1-б

Следует отметить, что тег

может включать те же атрибуты, что и теги самих списков

Вхождение

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

Заголовок группы вхождений 1

Вхождение 1-а

Вхождение 1-б

Заголовок группы вхождений 2

Вхождение 2-а

Вхождение 2-б

Введем следующее:

Заголовок группы вхождений 1

Вхождение 1-а

Вхождение 1-б

Заголовок группы вхождений 2

Вхождение 2-а

Вхождение 2-б

Закрывающие теги

и

списка определений можно опустить.

Разделители

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

. Общий синтаксис тега выглядит следующим образом:

Атрибут ALIGN определяет положение горизонтальной черты: center, left и right.

Атрибут WIDTH определяет длину линии, причем его значение можно задавать либо в пикселях простым целым числом, либо в процентах от ширины экрана при помощи чисел от 1-100 с добавлением символа %.

Атрибут SIZE задает толщину линии в пикселях, значение которого - целое число.

Атрибут COLOR определяет цвет заливки линии.

Например:

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

Бегущая строка

Для задания бегущей строки используется тег:

текст бегущей строки с атрибутами:

width=”…” – задаёт ширину бегущей строки в пикселях или в процентах от ширины экрана.

height=”…” - задаёт высоту бегущей строки в пикселях или в процентах от ширины экрана.

bgcolor=”…”- задаёт цвет фона бегущей строки.

behavior=”…”-задаёт тип движения бегущей строки и может иметь следующие значения: scroll-циклическая прокрутка из одного конца в другой, slide-текст появляется с одного края и останавливается у другого, alternate-текст перемещается от одного края к другому

(маятник).

direction=”…”-задаёт направление движения бегущей строки и может иметь следующие значения: left, right, Up,down.

scrollamout=”…”задаёт число пикселей, который отделяют один текст от последующего.

scrolldelay=”…” – указывает задержку в миллисекундах перед появлением следующего текстового блока.

loop=”…”-задаёт число повторений (любое положительное число. По умолчанию или при указании –1 или infinite, броузер будет прокручивать текст бесконечное количество раз.

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

target=”параметр”

title=”альтернативный текст”> текст_гиперссылки

Атрибут href указывает на адрес страницы, с которой Вы планируете установить гиперсвязь. Этот адрес может быть представлен как в виде полного URL (например, http://www.server.ru/page.html), если целевой документ физически расположен на другом сервере, так и в виде сокращенного URL с указанием пути к искомой страницы в пределах локального сервера (например, “/folder/page.html”). Если искомый документ расположен в одной директории с текущим, в качестве параметра атрибута href достаточно записать его название.

Атрибут target содержит директивы, описывающие правила открытия целевого документа в броузере, эти директивы выделяются в коде символом подчеркивания. Например, часто встречающееся значение атрибута target= «_blank» отображает открываемый по ссылке документ в новом окне броузера.

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

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

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

ключевое слово или заголовок раздела

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

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

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

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

Тэги логического форматирования обозначают (своими именами) структурные типы своих текстовых фрагментов, такие, например, как программный код (тэг ), цитата (тэг <СIТЕ> ), аббревиатура (тэг < ABBR > ) И Т. П.

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

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

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

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

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

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