2014-02-17
432
Переход к другому документу.
Атрибуты тэгов
Большинство тэгов имеет атрибуты, т.е. свойства, которые могут принимать различные значения. Например, если мы хотим, чтобы текст документа находился на желтом фоне, нам нужно использовать следующий код:
| <html> <head> ... </head> <body bgcolor='yellow'> Наш документ на желтом фоне </body> </html> |
Посмотрите на HTML -код и найдите название этого цвета. Нередко документ размещают на фоне некоторого рисунка. Сам рисунок должен находиться в файле графического формата (gif или jpg), а связь документа с ним обеспечивается атрибутом background тэга <body>:
| <html> <head> ... </head> <body background='sky.gif'> Наш документ на фоне неба </body> </html> |
Возможно, у Вас возник вопрос: "какого размера должен быть фоновый рисунок?"
Дело в том, что если размер рисунка меньше размера окна браузера, то рисунок будет дублироваться по всему окну. Этот принцип лежит в основе создания текстур для background'а. В качестве примера посмотрим на файлы 'О пакете' и 'Задания'. (Они вызываются из главного меню). Обратите внимание - текст в файле 'О пакете' словно скользит над неподвижным фоном, в 'Заданиях' же он прокручивается вместе с ним. Эффект "скольжения" достигается еще за счет одного атрибута тэга <body>:
|
|
|
| <html> <head> ... </head> <body background='адрес изображения' bgproperties='fixed'> Наш документ 'скользит' по фоновому рисунку </body> </html> |
Итак, Вам уже знакомы:
| Атрибуты тэга <body> | |
| background | адрес фонового изображения |
| bgcolor | цвет фона |
| bgproperties | fixed - для достижения эффекта скольжения текста по фону |
Метки и гиперссылки
Гиперссылки составляют самую "соль" любого HTML-документа. Гиперссылки - это фрагменты (слова, рисунки, кнопки и т.д.), щелкнув мышью на которых мы попадаем на новый документ или на новой место в этом же документе.
Гиперссылки создаются с помощью тэга <a>...</a> (англ.: anchor - якорь).
Гиперссылки имеют два основных атрибута: href и name.
Рассмотрим два типа гиперссылок:
Например, мы хотим, чтобы щелкнув на тексте ' Информация о пакете ' мы открыли в нашем окне документ ' About.html '.
| Код | Результат | |
| текст документа Информация о пакете |
Если документ большой, если в нем есть несколько смысловых разделов, желательно предусмотреть возможность перехода по гиперссылкам в пределах документа. Например, обеспечить возможность перехода на начало или конец документа. Для того, чтобы мы могли перейти на то или иное место в документе, его нужно предварительно отметить, бросить туда "якорь". Это делается с помощью того же тэга <a>, но с атрибутом name (a не href). Если Вы посмотрите на HTML-код этого документа, то в самом начале увидите фрагмент:
|
|
|
| <body> <a name="#nachalo"> ... |
Тем самым мы "отметили" начало документа. Визуально наличие этой метки незаметно - просматривая документ в браузере мы не можем узнать о ее существовании. Но предположим, нам нужно иметь возможность перейти на начало документа. Сделаем следующее:
| Код | Результат | |
| текст документа На начало документа |
Итак, основными атрибутами тэга <a> являются:
| name | Имя.Используется, если нужно отметить то или иное место в документе, чтобы потом "приходить" на него. |
| href | (hyper reference)- адрес документа, вызываемого при щелчке на гиперссылке, и/или имя метки для перехода (метка должна быть установлена заранее). Например, код <a href='#nachalo'> все заново </a> вызывает перемещение на начало данного документа, код <a href='Books.html#zakaz'> о заказе </a> вызывает перемещение на соответствующую метку в файле 'Books.html'. |
| target | Окно, в которое будет загружен указанный документ. Если этот атрибут опущен (или указан как _self), новый документ будет открыт в том же окне, что и текущий. Значение атрибута target="_blank" приведет к открытию нового документа в новом окне. |
Важно! Говоря о гиперссылках, следует отметить, что адрес документа (значение атрибута " href ") не следует указывать, как полный физический путь, например, гиперссылка: <a href="C:\Sum\Kek\Eos\Tests\LIntro.html">Введение в web-технологии</a>, конечно, сработает на Вашем компьютере, но если Вы перенесете Ваш файл на другой компьютер, то при его просмотре активизация гиперссылки приведет к тому, что браузер будет искать файл LIntro.html в папке Tests, вложеннной в папку Eos, вложенную в папку Kek, вложенную в папку Sum, находящуюся на диске C. Чтобы гиперссылка сработала на другом компьютере, он должен содержать такую же структуру папок. Если, к примеру, Вы перенесете свой файл не на диск C:, а на диск D:, то гиперсссылка работать не будет. Поэтому следует указывать не абсолютный, а относительный путь.
Так, если файл, на который Вы ссылаетесь, находится в том же директории, что и текущий, к нему следует обращаться просто по имени. Например:
<a href="LIntro.html">Введение в web-технологии</a>.
Если файл находится в какой либо папке, вложенной в папку с текущим файлом, следует указать имя папки и имя файла. Например:
<a href="Pages/Barbie.htm">Страничка Барби</a>.
Если файл находится в папке, которая содержит "текущую", обращение должно выглядеть следующим образом:
<a href="../имя файла">текст гиперссылки</a>.
Если файл находится в папке, вложенной в папку, содержащую "текущую", обращение должно выглядеть следующим образом:
<a href="../имя папки/имя файла">текст гиперссылки</a>.
Если нужно подняться на два уровня выше, обращение должно выглядеть следующим образом:
<a href="../../имя файла">текст гиперссылки</a>
и т.д....
К счастью, запоминать все эти правила не нужно - в HTML-редакторах есть "мастера" (или, как их еще называют "волшебники", wizards), которые автоматически определяют относительный путь к выбранному с помощью кнопки "Обзор" файлу. Следует учитывать, что автоматическое определение пути возможно лишь тогда, когда текущий файл уже сохранен, т.е. имеет адрес. Иначе - непонятно, относительно чего следует вычислять путь.
