Главная страница Случайная страница
КАТЕГОРИИ:
АвтомобилиАстрономияБиологияГеографияДом и садДругие языкиДругоеИнформатикаИсторияКультураЛитератураЛогикаМатематикаМедицинаМеталлургияМеханикаОбразованиеОхрана трудаПедагогикаПолитикаПравоПсихологияРелигияРиторикаСоциологияСпортСтроительствоТехнологияТуризмФизикаФилософияФинансыХимияЧерчениеЭкологияЭкономикаЭлектроника
Ступенька 13-ая.
|
|
Развлекательно-познавательный урок с любителем сосисок закончен, и мы переходим к следующему уроку, в котором мы поговорим о ссылках.
Наша страничка может состоять из нескольких документов. Один из них главный (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> < /a> делает ссылкой заключенную в него картинку или фразу (текст). Принципы прописывания пути мы уже знаем:
(1) - < a href=" prf.html" > мои фотографии< /a>
(2) - < a href=" photos/prf.html" > мои фотографии< /a>
(3) - < a href=" https://www.homepage.ru/prf.html" > мои фотографии< /a>
В случае (1) документ лежит в той же директории (папке), что и документ, в котором мы ссылаемся на prf.html, в случае (2) документ лежит в поддиректории /photos, в случае (3) мы ссылаемся на сайт https://www.homepage.ru, где лежит нужный нам документ.
Первые два примера (1) и (2) – называют относительными путями. (3) – абсолютный, т.е. указанный полностью, включая имя сайта (в нашем случае - https://www.homepage.ru/). Абсолютный путь мы используем, когда ссылаемся на чужие странички, относительный мы используем, когда ссылаемся на документы внутри нашего сайта.
Для всех ссылок в нашем документе мы можем прописать цвета: link - цвет просто ссылки, alink - цвет активной ссылки (нажатой), vlink - цвет уже посещенной ссылки.
< body text=" #336699" bgcolor=" #000000" link=" #339999" alink=" #339999" vlink=" #339999" >
Как и цвет для всего текста в документе, цвета ссылок мы прописываем в < body>. В нашем примере цвета для просто ссылки, активной и посещенной - одинаковые, но они могут быть разными – это на ваше усмотрение.
Итак, пропишем цвета для ссылки и саму ссылку в нашем документе:
| < 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=" primtocodephoto.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>). Для текстовых ссылок мы тоже можем задать разный цвет – это делается при помощи тэга < font> и его атрибута color:
< a href=" prf.html" > < font color=" #CC0000" > посмотреть мои фотографии< /font> < /a>
Обратите внимание, < font color=" …" > < /font> - прописывается внутри тэга < a> < /a>, если вы пропишите иначе, то у вас не получится задать вашей ссылке цвет отличный от цвета других ссылок в документе.
Давайте теперь перейдем на следующую ступеньку и продолжим знакомства с ссылками.