|
|
Гиперссылки. Ссылки|
| Ссылки
На данный момент с помощью блокнота мы создали только один HTML документ у меня он с именем index.html (зачем выбрал такое странное название index.html и зачем оно нужно смотрите в полезных советах) у Вас не знаю с каким, Вы сами имя придумывали, но думаю, Вы его помните и знаете где в твоей папке оно лежит. В этом документе мы попробуем создать ссылку на другой документ, которого у нас еще нет.. Так что прежде чем на него ссылаться, его нужно создать, благо Вы это уже умеете.
Открываем блокнот.
Пишем код на html языке. К примеру страничку с рядом фотографий (рисунков).
Сохраняем его как html страничку в ту же рабочею папку, где уже есть созданный нами первый документ. Давайте, что б не путаться назовем его primer.html, да и первый тоже пожалуй переименуйте в index.html
Теперь я знаю, что у Вас два html документа index.html и primer.html и что теперь у Вас есть минимальный набор для дальнейшего обучения.
Текстовые ссылки.
Знакомимся тег (от anchor- якорь), в него можно заключить текст или рисунок, которые станут ссылкой на те или иные документы. Атрибут тега href задаёт имя и путь к документу на который указывает ссылка.
Всё вместе пишется так:
Здесь мои фотки(рисунки)!!
Как Вы наверное поняли primer.html это имя нашего второго html документа, а надпись "Здесь мои фотки(рисунки)!!" это кусочек текста из файла index.html.
По аналогии с рисунками тег ![]() путь ссылки к открываемому документу прописывается теми же способами:
Здесь мои фотки!! - Такая запись подразумевает, что в директории, где расположен наш первый html документ есть папка stranica в которой расположен файл primer.html
Здесь мои фотки!! - А это значит, что файл primer.html размещен на уровень выше от документа
Здесь мои фотки!! - документ расположен на сайте www.site.ru..
Ну что давайте попробуем?
Пример:
Файл index.html:
Скажи мне, милый ребёнок: в каком ухе у меня жужжит?
В правом или левом?
А вот и не угадал! У меня жужжит в обоих ухах.
Ну я так не играю...
Продолжая говорить о цвете текстовой ссылки стоит упомянуть, что при необходимости можно принудительно выделять цветом как всю ссылку, так и отдельные её части (фразы слова буквы) знакомым тегом и его атрибутом color. Впрочем, это касается не только цвета так же отдельно можно задать размер, стиль и шрифт текста. Но помните, что манипуляции с цветом нужно проводить внутри тега вот здесь а не за бортом, иначе цвет ссылки будет либо по умолчанию, либо так как прописано в теге
Пример:
Файл index.html:
Посмотрите на фразу которая поможет Вам запомнить места цветов в радуге
Р
А
Д
У
Г
А
Каждый охотник желает знать где сидит фазан
вернуться на главную
Не в коем случае не нажимайте на эту кнопку!!!
Ракеты ушли... Америки больше нет...
.
Ссылка на e-mail
Я тут Вас чуть-чуть с толку сбил, вроде бы договаривались вместе писать полноценный сайт, а я тут какие то мелкие примерчики выкладываю.. Не волнуйтесь! В конце главы покажу готовый сайт про Карлсона целиком. А сейчас думаю так будет удобнее Вам читать, и мне писать.. : Да и подразумеваю что Вы уже самостоятельно можете вставлять теги в нужные места.
Напишите мне письмо.. - строчка из того примера..
Для того что бы сделать текст или рисунок ссылкой на e-mail - почтовый ящик его нужно заключить в тег , но не простой, а с использованием mailto
Пишем так:
Напишите мне письмо..
Эта непривычная запись будет говорить что, кликнув по тексту ссылке "Напишите мне письмо.." посетитель сайта попадет в свою почтовую программу, которая выдаст ему бланк для отправки письма, где в строчке Кому: уже будет указан нужный нам почтовый ящик karlson@kruha.ru
Пример:
Напишите мне письмо..
А. С. ПУШКИН
Сказка о попе и работнике его Балде
Сказка о рыбаке и рыбке
Сказка о царе Cалтане
Сказка о попе и работнике его Балде
Жил-был поп,
Толоконный лоб.
... ... ...
Сказка о рыбаке и рыбке
Жил старик со своею старухой
У самого синего моря.
... ... ...
Сказка о царе Cалтане
Три девицы под окном
Пряли поздно вечерком.
... ... ...
|
Обо мне!!!
|
Здесь мои фотки!!
|
Напишите мне письмо..
|
Напишите мне письмо..
|
Разрешите представиться Карлсон! … … …
|
|
Обо мне!!!
|
Здесь мои фотки!!
|
это я
и это я
снова я
|
|
|
Скачать 376 Kb.