Учебник по Html для начинающих. Простейшее.
Установка ссылок.
Наш сайт может состоять из нескольких документов. index.html - главный. При вводе адреса сайта в адресной строке браузера, он открывается первым и должен обязательно находиться в корне сайта. Остальные документы вы можете называть как угодно (photos.html, about_me.html, my_pets.html, friends.html, gh516hgd.html ипр.). Они все могут лежать в одной директории (папке), а могут в разных.
При помощи ссылок мы связываем эти документы. Так с главной страницы по ссылкам мы можем перейти на страницу с фотографиями, с этой страницы мы можем перейти обратно на главную страницу, или, допустим, на страницу с нашими стихотворениями, и т.д. Ссылкой на эти и другие документы (части нашего сайта) может быть текст или его часть, а может быть и картинка.
Для начала создадим новый документ (в нашем примере prf.html) в той же директории (папке), где находится наш главный документ index.html. Содержание документа выдумайте сами, у вас для этого уже достаточно знаний.
Пусть prf.html - документ с вашими фотографиями. Тогда мы можем без зазрения совести фразу "посмотреть мои фотографии" сделать ссылкой на prf.html:
<a href="prf.html">посмотреть мои фотографии</a>
Контейнер <a href="prf.html"></a> с переменной href="адрес.страницы" делает ссылкой заключенную в него картинку или текст. Принципы прописывания пути мы уже знаем:
1. <a href="prf.html">мои фотографии</a>
документ лежит в той же директории (папке), что и документ, в котором мы ссылаемся на prf.html,
2. <a href="photos/prf.html">мои фотографии</a>
документ лежит в поддиректории /photos,
3. <a href="http://www.homepage.ru/prf.html">мои фотографии</a>
мы ссылаемся на сайт http://www.homepage.ru, где лежит нужный нам документ.
Первые два примера (1) и (2) – называют относительными путями. (3) – абсолютный, т.е. указанный полностью, включая имя сайта (в нашем случае - http://www.homepage.ru/). Абсолютный путь мы используем, когда ссылаемся на чужие страницы, относительный мы используем, когда ссылаемся на документы внутри нашего сайта.
Для всех ссылок в нашем документе мы можем прописать цвета в открывающемся теге <body>: link - цвет просто ссылки, alink - цвет ссылки на которую наведена мышка, vlink - цвет уже посещенной ссылки.
<body text="#336699" bgcolor="#000000" link="#339999" alink="#339999" vlink="#339999">
В нашем примере цвета для просто ссылки, активной и посещенной - одинаковые, но они могут быть разными – это на ваше усмотрение. Это еще одна удобная возможность для Вашего посетителя - он отчетливо видит какие ссылку им уже были посещены. По умолчанию цвет ссылки синий с нижним почеркиванием.
Итак, пропишем цвета для ссылки и саму ссылку в нашем документе:
<html>
<head>
<title>Мой первый шаг </title>
</head>
<body text="#336699" bgcolor="#000000" link="#339999" alink="#339999" vlink="#339999">
<div align="center">
<H3>Здравствуйте, это моя первая страница.</H3>
<br>
<font color="#CC0000"> Добро пожаловать!</font> :) </div>
<p align="justify">
<img src="resaltphoto.gif" align="left" HSPACE=30 VSPACE=5 alt="моя фотография"> Я совсем недавно начал (а) знакомиться с виртуальной жизнью, но мне по давней традиции тоже захотелось создать свою домашнюю страничку для моих новых виртуальных друзей и знакомых, чтобы они могли <a href="prf.html">посмотреть мои фотографии</a>, почитать обо мне, черкнуть пару строчек в мою гостевую книгу. <br><br> А может и просто случайный посетитель вдруг захочет познакомиться со мной, и у меня появится <b> еще один виртуальный друг? :) </b><br><br> На фотографии изображен (а) я. Качество картинки не очень хорошее, к сожалению, поэтому она не четкая и разглядеть черты моего лица немного проблематично. Но в целом заметно, что я вполне ничего:) <br><br> Если ты так тоже думаешь, то давай как-нибудь встретимcя, поболтаем, чайку попьем в кафешке?:) Кто знает, может быть мы и в реальной жизни станем друзьями:)
</p>
</body>
</html> (посмотреть результат)
Как вы помните, мы можем задать различные цвета для разных блоков текста в нашем документе с помощью контейнера <font color="…"></font>. С его помощью мы тоже можем задать цвет ссылкам, отличный от цвета по умолчанию или установленного в открывающемся теге <body>:
<a href="prf.html"><font color="#CC0000">посмотреть мои фотографии</font></a>
Внимание: Обратите внимание, <font color="…"></font> - прописывается внутри тэга <a></a>, если вы пропишите иначе, то у вас не получится задать вашей ссылке цвет отличный от цвета других ссылок в документе.
<<< Страница 11 :Назад | Далее: Страница 13 >>>