25.4. Задание для выполнения на компьютере
1. В текстовом редакторе Блокнот создать HTML-документ с произвольным содержимым, включающий текст, списки. Определить различный шрифт текста.
2. Просмотреть созданный документ в браузере.
26. Разработка web-страниц
26.1. Гиперссылки и рисунки в Web-документах
Гиперссылки. В HTML-документах переход от одного фрагмента текста к другому задается с помощью тэга вида:
<a href="[адрес перехода]">выделенный фрагмент текста</a>
В качестве параметра [адрес перехода] может использоваться несколько типов аргументов:
1. Чтобы организовать ссылку на другой документ, надо задать имя этого HTML-документа, к которому нужно перейти. Например:
<a href="primer1.htm">столица </a>
Такой текст приведет к появлению в документе гиперссылки, т. е. подчеркнутого текста столица, при нажатии мышкой на который в текущее окно будет загружен документ с именем primer1.htm.
Если в адресе перехода не указано место размещения этого документа, то компьютер будет искать его в текущей папке.
2. Если необходимо дать ссылку на документ, находящийся на другом компьютере, нужно использовать тэг, например, вида:
<a href="http://www.ok.open.by/about.htm"> информация</a>
3. При необходимости можно задать переход не просто к некоторому документу, но и к определенному месту внутри этого документа. Для этого следует создать в документе, к которому будет задан переход, некоторую опорную точку или закладку.
Пусть, например, необходимо осуществить переход из файла 1.htm к словам «Раздел 5» в файле 2.htm (файлы находятся в одной папке). Прежде всего, следует создать в файле 2.htm следующий тэг:
<a name="aaa">Раздел 5</a>
Слова «Раздел 5» при этом никак не будут выделены в тексте документа. Затем в файле 1.htm можно определить переход на этот тэг:
<a href="2.htm#aaa">Переход к разделу 5 </a>
4. Если пользователь совершит переход по ссылке:
<a href="mailto:user@mail.box">Послать письмо</a>
то у него на экране откроется окно ввода исходящего сообщения его почтовой программы. В строке To: (Куда) окна почтовой программы будет указано user@mail.box.
Изображения в HTML-документе. В HTML-документах используются графические файлы в формате *.gif или *.jpg. Для вставки изображения с именем picture.gif, находящегося в одной папке с HTML-документом, надо использовать тэг вида:
<img src="picture.gif">
Такой тэг может также включать атрибут alt="[текст]", например:
<img src="picture.gif" alt="Картинка">
Встретив такой тэг, браузер покажет на экране текст Картинка и начнет загружать на его место картинку из файла picture.gif. Атрибут alt может оказаться необходимым на случай, если у браузера отключена автоматическая загрузка изображений.
Чтобы поместить flash-ролик на Web-страницу надо в Macromedia Flash выполнить команду File/Publish Preview/Html. Откроется flash-ролик в одном из браузеров. Нужно выполнить команду Вид/Исходный код страницы (или Вид/Источник), в появившемся окне скопировать текст между тэгами <object> и </object>, включая эти тэги, и вставить в тело html-документа. Для просмотра ролика надо открыть html-документ в одном из браузеров. В браузере Internet Explorer возможна ситуация, когда приложение показывает панель информации с предупреждением о наличии элемента ActiveX. Надо щелкнуть на верхней панели и выбрать пункт Разрешить заблокированное содержимое.
Цветовая гамма. Цвета всего HTML-документа задаются атрибутами, размещенными внутри тэга <body>: bgcolor определяет цвет фона документа; text – цвет текста документа; link − цвет гиперссылки; vlink − цвет ссылки на документ, который уже был просмотрен ранее; alink − цвет ссылки, когда на нее указывает курсор мыши и нажата ее правая кнопка.
Цвет кодируется последовательностью из трех пар символов. Каждая пара представляет собой шестнадцатеричное значение насыщенности заданного цвета одним из трех основных цветов (красным, зеленым и синим) в диапазоне от нуля (00) до 255 (FF).
Например: bgcolor=#FFFFFF − цвет фона (здесь – белый), text=#000000 − цвет текста (здесь – черный), link=#FF0000 − цвет гипертекстовой ссылки (здесь – красный)
Тэг <body> может включать атрибут background="[имя файла]", который задает изображение, служащее фоном для текста и других изображений. Фон должен быть представлен в формате *.gif или *.jpg. Браузеры заполняют копиями изображения-фона все окно.
Цвет фона и изображение-фон не отображаются при выводе HTML-документа на печать, поэтому лучше не использовать текст белого цвета.
Пример.
|
HTML-документ |
Web-документ |
|
<title>Пример 3</title> </head> <body> <h3> Минск - столица <a href="primer1.htm"> Беларуси </a></h3> <p><img src="minsk.jpg"></p> <p>Щелкните по нижнему рисунку</p> <p><a href="pr.html"> <img src="chuch.jpg"></a></p> </body> </html> |
Минск-столица
Беларуси Щелкните
по нижнему рисунку |
В этом примере используются файлы с рисунками minsk.jpg и chuch.jpg, которые хранятся в той же папке, что и исходный пример, а также устанавливается гиперсвязь с файлом primer1.htm, также хранящимся в этой же папке.