X
X
X
X

Помощен център

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

Препратка (линк, хипервръзка) в HTML

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

Вижте още: Какво е хипертекст (hypertext)? | Help

HTML тагът за препратка е <a>, като на неговия атрибут href се задава за стойност URL адресът, към който води връзката. Тагът има затварящ таг </a>. Например:

<a href="https://vpsextra.com">връзка към vpsextra.com</a>

В прозореца на браузъра ще се вижда текста връзка към vpsextra.com, при кликване върху който ще се отвори началната страница на сайта vpsextra.com

По подразбиране връзките се показват в браузъра сини на цвят и подчертани, а посетените връзки – виолетови. Цветът им може да бъде променен чрез ползване на CSS код.

Когато препратката води до вътрешна страница от сайта, е необходимо да се укаже точен адрес на тази страница.

пример:

<a href="https://myvpssite.com/page.html">Връзка към страница page.html от сайта myvpssite.com</a>

Препратки към страници от сайта

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

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

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

Файлове в основната директория:

  • index.html
  • page1.html

Файлове в поддиректория folder1:

  • page2.html

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

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

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

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

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

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

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

Препратки към части от една страница

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

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

1. Създава се т.нар. „котва“ чрез атрибута name на тага <а> . Кодът се поставя на мястото в страницата, към което ще води връзката. „Котвата“ трябва да има следния формат:

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

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

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

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

Котвата се поставя в онази част от страница, към която ще води връзката. Ако например връзката ще бъде към дъното на страницата, котвата се поставя в долната част на секцията BODY на страницата. (За да има ефект тази препратка, страницата трябва да е дълга.)

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

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

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

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

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

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

<a href="https://myvpssite.com/page.html#bottom">Връзка към долната част на страницата page.html от сайта myvpssite.com</a>

Препратка, която се отваря в нов прозорец

Обикновените препратки зареждат страницата, към която водят, в същия прозорец на браузъра, от който е кликнато на връзката. Така се губи от поглед първата страница и трябва да се натиска „Back“-бутона от менюто на браузъра за връщане в нея. За да се отвори страницата в отделен прозорец, към тага <a> се добавя атрибутът target и му се задава стойност _blank:

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

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

Препратка към имейл адрес

Препратката към имейл адрес изглежда по следния начин:

<a href="mailto:name@myvpssite.com">name@myvpssite.com</a>

Ако посетителят на страницата няма на устройството си приложение за електронна поща, няма да може да изпрати директно писмо, а ще трябва да препише или копира адреса. Затова е препоръчително във видимата част на връзката да се изписва електронният адрес, а не надпис от рода на „изпратете имейл“ или нещо подобно.

Изображения във вид на препратки

Освен текст за препратките може да служат и изображенията (картинки, снимки и пр.). За да се ползва едно изображение като препратка, трябва да се напише код, подобен на следния:

<a href="https://myvpssite.com"><img src="image.gif" /></a>

В случая се използва изображението image.gif, за да се направи връзка към сайта myvpssite.com.

Не можете да намерите информацията, която търсите?

Създайте билет за поддръжка
Намерихте ли го полезно?
(1001 пъти гледано / 41 го оцениха като полезно)

Top