HTML Урок Хипер връска

by **Shenko** Пет 04 Мар 2011, 12:44

Текстовите хипервръзки се задават в следния формат:

<a href="Тук се изписва адреса, към който ще води
връзката">Тук се изписва названието на
връзката, което ще се вижда на екрана</a>

Например ако желаете да пуснете връзка от страницата си към
страницата на Yahoo, която да носи названието "Връзка към [You must be registered and logged in to see this link.]
ще трябва да напишете следния код:

<a
href="[You must be registered and logged in to see this link.]">Връзка към [You must be registered and logged in to see this link.]</a>

В този случай в прозореца на
браузъра ще се вижда оцветен в синьо и подчертан текста
"Връзка към
www.yahoo.com".

Наименованието на хипервръзката може да бъде
всякакво, но е добре то да бъде подбрано така, че посетителите на
страницата да разбират накъде ще ги отведе тя.

Връзката от примера
води "навън" от вашата страница - към страницата на Yahoo. Когато правите
такива връзки е задължително да укажете пълния уеб-адрес, към който
връзката отвежда. Това означава да започнете адреса с [You must be registered and logged in to see this link.] както
е в примера.

Ако хипервръзката води не към началната страница на
някакъв сайт (например [You must be registered and logged in to see this link.] а към някаква вътрешна страница
(например page3.html), тогава трябва да изпишете пълния адрес на тази
страница, т.е. да укажете целия път по който се стига до нея:

<a
href="[You must be registered and logged in to see this link.]">Връзка към страница page3.html от сайта
[You must be registered and logged in to see this link.]</a>

[You must be registered and logged in to see this link.]

Текстови хипервръзки към страници от един и същ сайт

Освен към други сайтове хипервръзките могат да водят към други
страници на вашия сайт - по този начин той ще изглежда като един цял
документ. В този случай не е задължително да указвате пълния адрес на
дадена страница. Как точно ще зададете адреса зависи от това в коя точно
папка се намира страницата, към която пускате връзка.

Нека да
имаме следната структура на сайт:

- файл index.html, който се
намира в основната директория (папка)
- файл page1.html, който се
намира също в основната директория
- файл page2.html, който се намира
в папка folder1

Основна директория (основна папка)

index.html
page1.html

folder1 (папка,
вложена в основната)

page2.html

Тогава хипервръзките между тези страници трябва да изглеждат така

Връзката от началната страница index.html към страница page1.html,
която се намира в същата директория (папка), съдържа само названието на
страницата, към която води:

<a
href="page1.html">Връзка към
страница page1.html от началната страница index.html</a>

Връзката от началната страница index.html към страницата page2.html,
намираща се в папка folder1, трябва да съдържа наименованието на папката
(folder1) и наименованието на страницата (page2.html), отделени с
наклонена надясно черта:

<a
href="folder1/page2.html">Връзка към страница page2.html, намираща се в
папка folder1, от началната страница index.html</a>

Връзката от страницата page2.html, намираща се в папка folder1, към
началната страница index.html, трябва да съдържа две точки, наклонена
надясно черта и наименованието на страницата, към която води
(index.html):

<a
href="../index.html">Връзка
към страница index.html от страницата page2.html, намираща се в папка
folder1</a>

[You must be registered and logged in to see this link.]

Текстови хипервръзки към части от една и съща страница

Освен към външни страници и към страници от един и същ сайт
хипервръзките могат да водят и към различни места от една и съща страница.
Това е особено подходящо за дълги страници с разнообразна информация.

Хипервръзка към друга част от една страница се прави по следния
начин:

Първо трябва да създадете т.нар. котва и да я
поставите на мястото от страницата, към което пускате връзка. Котвата
трябва да има следния формат:

<a
name="Произволно зададено название на котвата"></a>

Да речем, че искате да
направите връзка към долната част на страницата си. Тогава създавате
котва, която трябва да изглежда така:

<a
name="bottom"></a>

Bottom означава "дъно" на английски, но това название е избрано
само за удобство - то може да бъде и всякакво друго, например kotva1,
dolu и т.н.

Сега поставяте така направената котва в долната част
на секцията BODY на страницата. (Не забравяйте, че за да има ефект тази
хипервръзка страницата трябва да е дълга.)

След това в горната част на страницата поставяте самата хипервръзка,
която ще води към вече направената котва. Тя трябва да изглежда така:

<a href="#bottom">Връзка към
долната част на страницата</a>

Т.е. хипервръзката съдържа названието на котвата със знака диез
(#) отпред.

Котвата която създадохме в горния пример е
невидима - между началния таг <a
name="bottom"> и затварящия таг </a> не изписахме никакъв текст. Ако желаете
може да зададете название на котвата, което да се вижда на екрана,
например:

<a name="bottom">Това е название на "котва", което ще се вижда на
екрана</a>

Ако в една страница са
използвани такива хипервръзки може да направите връзка към точно
определено място от определена страница по този начин:

<a
href="[You must be registered and logged in to see this link.]">Връзка към долната част на страницата
some-page.html от сайта some-site.com</a>

[You must be registered and logged in to see this link.]

Текстови хипервръзки към е-mail адрес и файл на FTP
сървър

Съществуват и други видове хипервръзки. Това са
връзки към e-mail адреси и връзки към файлове, намиращи се върху FTP
сървър.

Кода за връзка към e-mail адрес е следния:

<a
href="mailto:some-name@some-where.com">[You must be registered and logged in to see this link.]</a>

Имайте предвид, че ако
посетителя на страницата ви няма на компютъра си праграма за електранна
поща няма да може да ви изпрати директно e-mail, а ще трябва да препише или копира
адреса. Затова е препоръчително във видимата част на връзката да
изписвате електранния си адрес, а не "изпратете имейл" или нещо подобно.

Кода за връзка към файл, разположен на FTP сървър е:

<a
href="[You must be registered and logged in to see this link.]">Връзка към файл в zip формат от FTP
сървър</a>

Имайте предвид, че
някои от FTP сървърите не са предоставени за публично ползване и
изискват потребителско име и парола. Ако вие имате достъп до такъв
сървър ще може да направите връзка към някакъв файл от сървъра, но ако
посетителя на страницата ви няма име и парола за достъп няма да успее да
изтегли файла.

[You must be registered and logged in to see this link.]

Хипервръзки които се отварят в отделен прозорец

Повечето хипервръзки върху които щракате се отварят в същата
страница, която гледате в момента на щракането. Така губите от поглед
първата страница и трябва да натиснете "Back"-бутона от горното меню на
браузъра, за да се върнете на нея. Понякога е много удобно дадена
хипервръзка да се отвори в отделен прозорец. Вие може да отваряте всяка
хипервръзка в интернет в отделен прозорец ако преди да щракнете върху нея
натиснете бутон "Shift" (с надпис Shift и/или дебела стрелка, сочеща
нагоре). Но много потребители в интернет не познават пълните
възможности на клавиатурата.
HTML дава възможност да зададете отваряне
на хипервръзка в нов прозорец чрез използване на атрибута
target. Той може да приема няколко стойности.

За да зададете отваряне на хипервръзка в нов прозорец трябва да
присвоите на атрибута target стойност _blank.
Нека например
да направим хипервръзка, която ще отваря в отделен прозорец сайта на
Yahoo. Трябва да напишем следния код:

<a
href="http://www.yahoo.com" target="_blank">Връзка към Yahoo, която ще се отвори в нов
прозорец</a>

Ето я същата
връзка в прозореца на браузъра: [You must be registered and logged in to see this link.]

Натиснете върху нея, за да видите ефекта.

Другата стойност на target е _self. Тази стойност задава
отваряне на хипервръзката в същия прозорец, който е отворен в момента на
щракането върху нея, т.е. ефекта е същия, който е и по подразбиране.

Като стойност на таргет може да се зададе и произволно избрано от
вас име. Например target="myname" и т.н. По този начин всички
връзки (например 5 на брой), на които присвоите атрибута target със
стойност myname ще се отварят в един и същ прозорец.

[You must be registered and logged in to see this link.]

Промяна на цвета на текстовите хипервръзки

По
подразбиране всички хипервръзки са сини на цвят и подчертани. В урока за
атрибутите на тага <body> научихте как се задава цвета на
хипервръзките - това става чрез атрибутите

link - задава цвят на непосетените връзки

alink - задава цвят на връзките в момента на щракането в/у тях

vlink - задава цвят на вече посетени връзки

Например, за да
зададете бял фон, черен текст, син цвят на връзките (той е и по
подразбиране - може да не се задава), червен цвят при щракане върху тях и
отново син цвят за посетени връзки, трябва да напишете следния код:

<body bgcolor="#ffffff" text="#000000"
link="#0000ff" alink="#ff0000" vlink="#0000ff">

Сигурно сте забелязали, че в много сайтове връзките сменят цвета
си когато отидете с мишката върху тях или от неподчертани се превръщат в
подчертани и обратно /тези ефекти могат да се видят и в настоящия сайт/.
Това се постига чрез използването на CSS
(Cascading Style Sheets) - Каскадни набори от стилове. По-късно ще
бъдат въведени уроци за използването на CSS

АКО ИСКАТЕ ДА УЛЕСНИТЕ ИЗТЕГЛЕTE [You must be registered and logged in to see this link.]

Kakво е [You must be registered and logged in to see this link.]

Какво е [You must be registered and logged in to see this link.]

Какво е [You must be registered and logged in to see this link.]