Hoe een link in HTML, een tag en zijn attributen in te voegen

  1. Koppel tag <a> en zijn kenmerken
  2. Hoe een koppeling te maken om het bestand te downloaden
  3. Relatieve en absolute links, hun verschil

Hallo, beste lezers van de site Uspei.com. In deze korte les hebben we tijd om de technologie van het maken van links te leren. Om een ​​link in html in te voegen, gaan we naar de code van onze pagina en zoek de tekst 'http://www.howtocorp.com/typepilot'. Ik heb 73 documentregels. U kunt dit bestand openen met behulp van onze teksteditor Notepad ++ .

Terug naar index ↑

Koppel tag <a> en zijn kenmerken

Open vóór deze tekst de tag <a> die de koppeling maakt. Dit is een paar-tag, dus we moeten de tag sluiten op de plaats waar de link met ons eindigt.

<a> http://www.howtocorp.com/typepilot </a>

Nu moeten we de kenmerken voor de tag <a> registreren, omdat zonder deze gegevens de browser niet begrijpt wat hij met onze link verder moet doen. Registreer het eerste vereiste kenmerk voor de link - href . Dit is het belangrijkste attribuut voor de link. Het geeft aan waar deze link naartoe leidt. In ons geval leidt de link naar de site http://www.howtocorp.com/typepilot. Daarom schrijven we het voor voor het href-kenmerk.

<a href="http://www.howtocorp.com/typepilotince http://www.howtocorp.com/typepilot </a>

Laten we nu eens kijken wat we in de browser hebben gedaan.

Zoals we zien, is de tekst veranderd in een link. Als u op deze link klikt, wordt een geheel andere pagina geladen. En het zal laden, let op, in plaats van onze pagina! Het is niet altijd handig, want U kunt een bezoeker verliezen die de link naar een andere site volgt. Daarom is er voor koppelingen een doelattribuut. Als we willen dat deze link in een nieuw venster wordt geopend, moeten we de waarde voor _ blank instellen .

<a href="http://www.howtocorp.com/typepilot express_==_blueface> http://www.howtocorp.com/typepilot </a>

Dit is hoe de code van onze link eruit zal zien. En als we onze pagina in de browser vernieuwen, zullen we zien dat wanneer op de link wordt geklikt, onze pagina wordt geopend en de pagina op de link wordt geopend in een ander tabblad of venster.

En een ander attribuut voor de link is het universele title- attribuut, dat met bijna alle tags kan worden gebruikt. Dit kenmerk is verantwoordelijk voor de hint. Het is vaak nodig om de gebruiker te vragen waar deze link naartoe leidt. De tip zou moeten verschijnen als je de muisaanwijzer over de link beweegt. Laten we dit kenmerk voor onze link schrijven.

<a href=eshttp://www.howtocorp.com/typepilot "target= "_blank betoverende titel=tР typeРёР"РРёР type Pilotina> http://www.howtocorp.com/typepilot </a>

Nu zullen we opslaan en verifiëren dat we zijn uitgegeven in de browser. We hebben dus een hint wanneer u de muiscursor boven de link houdt.

Terug naar index ↑

Hoe een koppeling te maken om het bestand te downloaden

Laten we nu leren hoe we koppelingen kunnen maken die ons de mogelijkheid bieden om bestanden te downloaden. Hiervoor hebben we een bestand nodig. U kunt dit bestand bijvoorbeeld downloaden. Als het bestand niet is gedownload en in een nieuw tabblad is geopend, klikt u op de rechtermuisknop en klikt u op "opslaan als".


Link naar time.pdf

Laten we de onderste link doen om dit artikel in pdf-formaat te downloaden. Maar laten we eerst een aparte map voor onze bestanden maken en deze bestanden een naam geven. In deze map plaatsen we ons bestand time.pdf.

Open daarna ons bestand met de code en maak onderaan, vóór het sluiten van de <body> -tag, een alinea:

<p> Download dit artikel in pdf-formaat </ p>

Laten we ons bestand opslaan en controleren of er een alinea is verschenen.

Er is een alinea verschenen en nu is het onze taak om van deze alinea een link te maken naar het downloaden van het bestand. Om dit te doen, voegen we een alinea in de tag <a> in . Voor een tag schrijven we het href- kenmerk voor en hiervoor schrijven we geen link naar de pagina voor, maar een link naar een specifiek bestand.

<p> <a href="files/time.pdf services> Download dit artikel in pdf-formaat </a> </ p>

Als we nu ons bestand opslaan en het werk in de browser controleren, zullen we het bestand gaan downloaden zodra we op de link klikken.

Terug naar index ↑

Relatieve en absolute links, hun verschil

Er dient te worden opgemerkt dat in dit geval wij een relatieve verbinding aangaven, d.w.z. De link die we hebben is relatief ten opzichte van het document index.html.

Laten we nu een voorbeeld geven van een absolute link. Laat me je eraan herinneren dat met een dergelijke link het pad volledig is aangegeven, te beginnen bij het begin van de site. bijvoorbeeld:

<a href="http://www.howtocorp.com/typepilot> Klik hier </a>

In deze link wordt het pad opgegeven beginnend met de sitenaam gevolgd door de map. Als u op deze koppeling klikt, wordt het bestand index.html op deze site geladen. In dit geval was het natuurlijk mogelijk om een ​​specifieke pagina na de mapnaam aan te geven. Het belangrijkste om te onthouden is dat de absolute link begint met de site en het volledige pad naar het bestand of de map aangeeft.

We hebben dus het proces van het maken van links in het html-document besproken, de kenmerken voor de tag <a> behandeld en ook geleerd hoe u links kunt maken, niet alleen naar andere pagina's, maar ook om een ​​specifiek bestand te downloaden. Even later zullen we bespreken hoe koppelingen te gebruiken om uw site naar de top te brengen .



Tot snel! Doe alles en altijd op de pagina's van de blog Uspei.com

Help het project - abonneer je op ons Yandex.DZen-kanaal!