Introducere în Web Development

Capitolul 2: HTML
Ancore

Din perspectiva unui user, cel mai folosit element de pe Web este link-ul. Acesta îți permite să navighezi de la o pagină la alta. Însă în HTML un link nu este dat prin elementul <link> (element care există dar are altă întrebuințare), ci prin elementul <a>

                    <a href="undeva.html">
  Aici e linkul dumneavoastră
</a>
                

În continuare, am să le numesc „ancore”.

Ancorele pot avea mai multe atribute, dar cel mai important este href. Aici definim unde va ajunge utilizatorul atunci când apasă pe ancoră.

Ancore spre alt fișier

Atunci când vrem ca link-ul nostru să ducă spre alt fișier HTML, sau altă adresă din același site, punem calea spre fișier, relativ la fișierul în care suntem.

Iată câteva situații:

Conținutul continuă după reclamă

Ancore spre alt site

Atributul href poate avea un URL complet, începând cu http:// sau https://

                    <a href="https://www.ScoalaWeb.ro/">
  Această ancoră ar deschide site-ul ScoalaWeb
</a>
                

Ancore în interiorul paginii

Dacă vrem să navigăm în interiorul documentului în care ne aflăm, cum face Wikipedia, va trebui să creăm un element cu id="nume-ales-de-noi"
și link-uri cu href="#nume-ales-de-noi".

Exemplu:

                    <a href="#partea-interesanta">
  Această ancoră va face scroll la partea interesanta
</a>
                

Presupunem că sunt multe chestii aici...

                    <h2 id="partea-iteresanta">
  Partea interesantă
</h2>
                

Ancorele cu #hashtag pot fi folosite și împreună cu un URL sau o cale spre un fișier. În acest caz, se va deschide acel URL sau fișier, direct la elementul din hashtag:

                    <a href="https://en.wikipedia.org/wiki/Tim_Berners-Lee#Personal_life">
                
Conținutul continuă după reclamă

Ancore spre alte servicii

Ancorele din HTML pot inclusiv să deschidă alte aplicații.

Dacă atributul href începe cu mailto:, browserul va deschide aplicația de e-mail. Se poate include și o adresă, care să fie pusă automat, dar și alte detalii

Exemplu:

                    <a href="mailto:cornel@scoalaweb.ro?subject=Ce faci&#63;&amp;body=De ce nu răspunzi&#63;">
  Dă-mi un e-mail
</a>
                

Se mai poate folosi prefixul tel:, urmat de un număr de telefon, pentru a deschide aplicația de telefon.

                    <a href="tel:+40765432109">
  Sună-mă
</a>
                

Notă: acesta nu este numărul meu de telefon. Habar nu am cine o să răspundă dacă încercați să sunați.

Se pot folosi și alte prefixe de servicii în href, dar trebuie să existe o aplicație instalată pe dispozitiv care suportă acel serviciu.

Designed by