Стилевое оформление текста
В языке HTML текст можно отображать текст жирным шрифтом, подчеркиванием или курсивом. В этом разделе мы разберем – как технически это сделать. Рассмотрим следующий пример на листинге 5.
Листинг 5.
<HTML> <HEAD>
<TITLE> Стилевое оформление </TITLE> </HEAD> <BODY>
<H1 ALIGN =center> <U> Добро пожаловать на наш сайт! </U></H1>
Мы разработали эту страницу для обучения
возможностям языка <EM>HTML</EM>. Далее Вы познакомитесь с многими возможностями языка <STRONG> <U>HTML </U></STRONG> </BODY> </HTML>
В этом примере нам встречается подчеркивание. Для этого используются тег <U> и соответственно </U>. Обратите внимание на строку ALIGN = center в теге <H1>. Это обеспечивает выравнивание заголовка первого уровня по центру.
Тег <EM> позволяет обеспечить курсив последующего текста. Следует заметить, что когда Вы используете вложенные теги, то не забывайте закрывать их в обратном порядке. Тег <STRONG> применяется для жирного шрифта последующего текста. На рис.4 показан результат отображения файла в окне браузера.
Рис.4.
Иногда необходимо сохранить авторское форматирование текста в окне браузера. В этом случае в окне текст отображается, так как он выглядит в исходном варианте (так как мы его набирали блокноте). Для этого используется тег PRE. На листинге 6 показан пример файла на эту тему.
Листинг 6.
<HTML> <HEAD>
<TITLE> Тег Pre </TITLE> </HEAD> <BODY>
<PRE> Щелкните на названии любой строки,
выделяемой якорем,
чтобы перейти к
соответствующей странице.
</ PRE>
Следует заметить, что когда Вы используете вложенные теги, то не забывайте закрывать их в обратном порядке.
</BODY> </HTML>
Гиперссылки
Самой важной особенностью HTML является возможность создавать гиперссылки на другие документы, находящиеся или здесь же (в той же папке или просто на этом же компьютере), или в каком-то другом месте (на других компьютерах в сети Internet).
В HTML для ссылок на другие Web-страницы в качестве якоря может выступать как текст, так и изображения. Далее на листинге 7 приведен пример использования якорей на уже созданные нами страницы (предыдущие HTML-файлы). Заметим, что в программе принято, что предыдущие тексты располагаются в файлах программа1.html и программа2.html. Если Вы сохранили свои разработки в других файлах, то Вам следует скорректировать названия.
Листинг 7.
<HTML> <HEAD>
<TITLE> Гиперссылки </TITLE> </HEAD> <BODY>
<H2> <U> Пример использования якорей </U></H2>
<P> Щелкните на названии любой строки, выделяемой якорем,
чтобы перейти к соответствующей странице:</P>
<P> 1 гиперссылка <A HREF="программа1.html">
Запустите Вашу первую страницу </A></P>
<P> 2 гиперссылка <A HREF="программа2.html">
Запустите Вашу вторую страницу </A></P>
</BODY> </HTML>
На рис.5 приведен результат выполнения файла в окне браузера.
Р
ис.5.
Первая ссылка на другую страницу приведена во фрагменте - <P> 1 гиперссылка <A HREF="программа1.html"> Запустите Вашу первую страницу </A></P>. Ссылки вводятся в текст с помощью элемента А (якорь). Важным параметром якоря является адрес. Для задания адреса необходимо использовать атрибут HREF тега якорь следующим образом: <A HREF = “адрес”>.
В качестве адреса указывается местонахождение файла. В данном случае предполагается, что файлы (программа1.html и программа2.html) находятся в одном каталоге, поэтому в качестве ссылки указывается только имя файла. Если Вы хотите указать ссылку на файл находящийся в другом каталоге, то необходимо указать полный путь к этому файлу. Это выглядит следующим образом -
<A HREF= "C:/inrormatika/программа1.html">.
Если Вы хотите использовать ссылку на страницу в Интернете (находящуюся на другом компьютере), то можно указать адрес этой страницы. Например, это может выглядеть следующим образом –
<A HREF="http://www.nnov.ru">.
Якоря могут ссылаться на электронные адреса, и если щелкнуть на такой ссылке, то будет загружена используемая по умолчанию программа для работы с электронной почтой с автоматической инициализацией сообщения на заданный по ссылке адрес. Ссылки на электронный адрес выглядят следующим образом –
<A HREF = "mailto: электронный адрес"> отправить письмо… </A>.
Например,
<A HREF="mailto:ivan@rambler.ru"> Мой адрес электронной почты</A>.
Можно также указать гиперссылку на документ созданный в одном из приложений (например, в Microsoft Word или в Microsoft Excel). В этом случае при открытии подобной страницы Вам будет предложено открыть рассматриваемый файл в соответствующем приложении либо сохранить файл на диске. На листинге 8 показан пример с гиперссылками на документы Word и Excel.
Листинг 8.
<HTML> <HEAD>
<TITLE> Гиперссылки </TITLE> </HEAD> <BODY>
<H2> <U> Пример использования якорей </U></H2>
<P> Щелкните на названии любой строки, выделяемой якорем,
чтобы перейти к соответствующему файлу.</P>
<P> 1 гиперссылка <A HREF="Файл1.doc">
Откройте файл с методическими указаниями </A></P>
<P> 2 гиперссылка <A HREF="Книга1.xls">
Файл с электронной таблицей</A></P>
</BODY> </HTML>
По умолчанию все гиперссылки отображаются синим цветом с подчеркиванием. Уже просмотренные гиперссылки меняют цвет на фиолетовый. В дальнейшем мы рассмотрим каким образом можно изменить эти цвета.