hyperlink a

wartości atrybutu rel w elemencie a:

  • alternate
  • archives
  • author
  • bookmark
  • external
  • first – porządek nawigacji
  • help
  • index – porządek nawigacji
  • last – porządek nawigacji
  • license
  • next – porządek nawigacji
  • nofollow
  • noreferrer
  • prev – porządek nawigacji
  • search
  • sidebar
  • tag
  • up

Odwołanie do miejsca na stronie poprzez użycie kotwicy w linku # i atrybuty name.

Sposoby wyświetlania strony poprzez atrybut target:

  • _self – w tym samym oknie, wartość domyślna
  • _blank – nowa strona otwarta w nowym oknie przeglądarki
  • _parent – nowa strona otwarta w dokumencie 'rodzic’ bieżącej strony. Dokument rodzic jest zazwyczaj oknem przeglądarki, które otworzyło bieżącą stronę
  • _top – nowa strona otwarta w głównej części okna bieżącej przeglądarki

<a href="mailto:hello@webscene.pl?subject=Zapytanie ze strony" rel="author">Agnieszka Trefler</a>

<a href="#mywork">My Work</a>




<div name="mywork">
</div>



<a href="https://webscene.pl" target="_blank">

pseudoklasy css3 dla elementu a:

  • :link
  • :visited
  • :hover
  • :active

 

Mapy odsyłaczy <map></map> – obrazek, zdjęcie podzielone na obszary będące hiperłaczami.

Map posiada atrybut name

Area – wewnętrzny znacznik map posiada atrybuty:

  • href – hiperłącze
  • coords – współrzędne krańcowe obszaru aktywnego
  • shape – kształt aktywnego obszaru:
    • circle (koło) – parametry – środek koła i promień
    • rect (kwadrat) – parametry – lewy górny róg i prawy dolny róg
    • polygon (wielokąt) – parametry – współrzędne x,y dla każdego wierzchołka
  • title
<map name="mountain">
<area href="#" shape="rect" coords="100,10,200,50" />
</map>

<img src="myPath/images.png" height="60" width="210" usemap="#mountain" />

Anchor:

<a href="http://mywebsite.com#mountain">See more</a>
<p name="mountain">some text, some text</p>

Styl zależny od wartości linku:


a.button[href^="mailto:"] {
	background: #fff url('images/icon-mail.png') no-repeat center right 24px;
}
a.button[href^="tel:"] {
	background: #fff url('images/icon-phone.png') no-repeat center right 24px;
}