Link-uri

postat acum 4 ani de Stefanescu Mihai in categorie HTML

O pagina web poate contine mai multe link-uri ce te duc la alte pagini sau chiar la anumite sectiuni din alte pagini. Acestea sunt cunoscute ca si hyperlink-uri.

Hyperlink-urile le permit vizitatorilor sa navigheze intre paginile website-ului doar dand click pe anumite cuvinte, fraze sau imagini.

Un link poate fi creat in HTML cu ajutorul tag-ului <a>. Acesta se numeste anchor tag si tot ce este pus intre <a>si </a> face parte din link.

<a href="adresa URL">Text Link</a>

 Atributul Target

Putem folosi un atribut numit target ce ne ajuta sa specificam locatia de deschidere a link-ului.

Optiune Descriere
 _blank Se deschide intr-un tab nou
 _self Se dechide in tab-ul curent
 _parent Se dechide in tab-ul parinte
 _top Se dechide intr-o fereastra
 targetframe Se deschide intr-un anumit frame
<!DOCTYPE html>
<html>
<head>
<title>Exmple Hyperlink</title>
<base href="http://invata-programare.ro/">
</head>
<body>
<p>Mai jos este lista de link-uri</p>
<a href="/toate-lectiile-html" target="_blank">Link _blank</a> |
<a href="/toate-lectiile-html" target="_self">Link _self</a> |
<a href="/toate-lectiile-html" target="_parent">Link _parent</a> |
<a href="/toate-lectiile-html" target="_top">Link _top</a>
</body>
</html>

Exemplul de mai sus va avea urmatorul efect:

Mai jos este lista de link-uri

Link _blank | Link _self | Link _parent | Link _top

Base

Cand link-urile tale HTML leaga acelasi site nu este necesar sa scrieti fiecare URL-ul complet pentru fiecare link. Puteti scapa de acest URL complet folosind tag-ul <base> in headerul documentului vostru HTML. Acest tag da o cale completa tuturor link-urilor.

 

<!DOCTYPE html>
<html>
<head>
<title>Hyperlink Example</title>
<base href="http://www.invata-programare.ro/">
</head>
<body>
<p>Link:</p>
<a href="/toate-lectiile-html" target="_blank">Tutorial HTML</a>
</body>
</html>

Link catre o anumita sectiune a paginii

Puteti face un link catre o anumita sectiune a unei pagini web folosind atributul name.

Prima data facem un link de forma aceasta intr-o zona a paginii in care doriti sa ajungeti.

<h1>Tutorial link-uri HTML <a name="top"></a> </h1>

Apoi faceti un link care sa se termine in #numele_dat_in_name:

<a href="/learn-html/link-uri-2#top">Mergi sus</a>

Rezultat:

Mergi sus

Setare Culoare Link

Chiar daca va recomand sa setati culorile link-urilor din CSS (Lectie CSS despre Link-uri) am sa va invat sa faceti asta si din HTML.

<!DOCTYPE html>
<html>
<head>
<title>Hyperlink Example</title>
<base href="http://invata-programare.ro/">
</head>
<body alink="#54A250" link="#040404" vlink="#F40633">
<p>Linkuri</p>
<a href="/toate-lectiile-html" target="_blank" >Cursuri HTML</a>
</body>
</html>

 

Sunt un tanar programator din Bucuresti ce lucreaza in PHP/Mysql (MySqli/PDO), Laravel, CodeIgniter, MySQL, PostgreSQL, Wordpress, HTML5/CSS3, Sass, Photoshop si multe altele.
Google+ Community Facebook Group
Acest articol a fost mutat de pe vechea platforma.
Pentru orice eroare aparuta la mutare va rog sa ma contactati!

Comentariu postate de Garaj Nicu la data de 06.07.2018
Poți folosi orice html redactor
Comentariu postate de minecraft download for free la data de 14.05.2019
I do accept as true with all of the ideas you've presented in your post. They're very convincing and will definitely work. Still, the posts are very brief for beginners. Could you please prolong them a little from subsequent time? Thanks for the post.
Comentariu postate de adidas gazelle la data de 15.05.2019
I wanted to post you the little remark to finally say thanks a lot once again for your fantastic concepts you have discussed on this website. It is simply seriously open-handed with people like you to deliver easily what exactly some people could have advertised for an ebook to end up making some bucks on their own, especially given that you could possibly have tried it if you desired. Those things as well worked to become fantastic way to comprehend some people have the identical dream the same as mine to grasp a lot more in regard to this issue. I'm sure there are a lot more pleasurable sessions ahead for individuals who discover your blog post.
Comentariu postate de minecraft pc download la data de 16.05.2019
I always used to read piece of writing in news papers but now as I am a user of net therefore from now I am using net for articles or reviews, thanks to web.
Comentariu postate de minecraft download free pc la data de 17.05.2019
I have read a few excellent stuff here. Certainly value bookmarking for revisiting. I surprise how much effort you place to create such a great informative website.