HTML. Индексы

Цель работы: изучение дескрипторов < SUP>, < SUB> и приобретение умения задания размера шрифта в документе WEB.

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

Дескриптор < SUP> позволяет преобразовать фрагмент текста в Рис. 8-1. Создание надстрочных и подстрочных индексов.

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

Ход работы:

1. Ознакомьтесь с данной инструкцией, вызовите броузер WEB щелчком «мыши» по иконке, откройте в нем «пустую» страницу. Откройте ее в виде HTML.

2. Наберите в открывшемся блокноте пример показанный на рисунке 8-1, сохраните изменения в меню “файл→ сохранить” и обновите страницу.

3. Затем в меню “файл→ открыть” откройте файл созданный в лабораторной работе № 7 (в ранее созданном шаблоне в лабораторной работе №7 «Калоев HTML».

4. Внесите в него ниже приведенные изменения (см. текст ниже), в графическом редакторе Блокнот.

5. Документ, сохраните в меню “файл→ сохранить” и вновь обновите страницу.

В итоге, документ HTML будет выглядеть следующим образом:

< html>

< TITLE> Моя первая проба сил в HTML< /TITLE> <! -- тег названия страницы -->

< head> ПРОБА - ШАБЛОН< /head> <! -- тег заголовков -->

< body>

< Hl> < CENTER> < B> < FONT FACE=”Arial, Times New Roman Cyr”> МОЯ ПОЭТИЧЕСКАЯ СТРАНИЧКА< /B> < /CENTER> < /Hl>

< P> < ALIGN=" left" > < U> & #169; 2005-09-08 Калоев Николай< /U> < /P>

< P> Можете прочесть, вот одно из последних. < SUP> Я люблю стихи, в том числе и собственного сочинения.< /SUP> < SUB>

< STRIKE> Э-э-э-э... < /STRIKE> < /SUB> < /P> < P> Эти удались, особенно финал: < /P>

< PRE>

Мораль сей басни такова

Хоть стой, хоть ляг, хоть встань.

Как сплетнику нужна молва

И как певцу - слова,

И как огню нужны дрова,

Как к чаю сладкая халва,

Как к пиву мелкая плотва,

Так нужен WEB-дизайн!

< /PRE>

< /body>

< /html>

6. Сохраните набранный текст под тем же расширением «.html» в отдельной папке в корневом каталоге или в папке «Мои документы» под названием включающей Вашу фамилию, например: Калоев HTML. Лаб. 8).

7. Запустите полученный файл в броузере Internet Explorer и в открывшемся окне Вы увидите набранный абзац «Проба сил в HTML ».

8. Студенту предлагается проанализировать набранный код фрагмента программы, поэкспериментировать, изменяя написание приведенных дескрипторов (тэгов) в редакторе Блокнот (не забудьте сохранить изменения и обновить страницу).

9. Оформить лабораторную работу в письменном виде (преподавателю сдавать лабораторную работу и в письменном и в электронном виде).

Задачи для самостоятельного решения.

Предлагается самостоятельно изменить дескриптор < SUB> этого примера таким образом, чтобы образовалась сноска, текст сноски составьте сами.

Измените в контейнере < PRE > структуру стиха таким образом, чтобы оно выглядело обычным образом.

Измените атрибут ALIGN, чтобы посмотреть изменение написания шрифта, например на RIGHT.

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

1. Какие тэги вы применили в выше приведенном фрагменте?

2. Как в HTML подбирать размер подстрочного индекса?

3. В HTML 3.2 можно опустить специальные дескрипторы форматирования?

4. В каком порядке располагаются дескрипторы HTML и атрибуты?