linki HTML

w tym tutorialu dowiesz się, jak tworzyć linki do innych stron w HTML.

tworzenie linków w HTML

link lub hiperłącze to połączenie z jednego Zasobu Internetowego do drugiego. Linki umożliwiają użytkownikom bezproblemowe przechodzenie z jednej strony na drugą, na dowolnym serwerze w dowolnym miejscu na świecie.

link ma dwa końce, zwane kotwicami. Łącze rozpoczyna się w zakotwiczeniu źródłowym i wskazuje na zakotwiczenie docelowe, które może być dowolnym zasobem internetowym, na przykład obrazem, klipem audio lub wideo, plikiem PDF, dokumentem HTML lub elementem samego dokumentu i tak dalej.

domyślnie linki będą wyświetlane w następujący sposób w większości przeglądarek:

• nie odwiedzony link jest podkreślony i niebieski.
• odwiedzany link jest podkreślony i fioletowy.
• aktywny link jest podkreślony i czerwony.

jednak możesz to nadpisać za pomocą CSS. Dowiedz się więcej o łączach do stylizacji.

składnia linków HTML

linki są określone w HTML za pomocą znacznika <a>.

link lub hiperłącze może być słowem, grupą słów lub obrazem.

wszystko między otwierającym znacznikiem <a> a zamykającym znacznikiem </a> staje się częścią linku, który użytkownik widzi i klika w przeglądarce. Oto kilka przykładów linków:

<a href="https://www.google.com/">Google Search</a><a href="https://www.tutorialrepublic.com/">Tutorial Republic</a><a href="images/kites.jpg"> <img src="kites-thumb.jpg" alt="kites"></a>

atrybut href określa cel łącza. Jego wartością może być bezwzględny lub względny adres URL.

bezwzględny adres URL to adres URL zawierający wszystkie części formatu URL, takie jak protokół, Nazwa hosta i ścieżka dokumentu, np. https://www.google.com/, https://www.example.com/form.php itp. Podczas gdy względne adresy URL są ścieżkami względnymi strony, np. contact.html, images/smiley.png i tak dalej. Względny adres URL nigdy nie zawiera prefiksu http:// lub https://.

ustawianie celów dla linków

atrybut target informuje przeglądarkę, gdzie ma otworzyć połączony dokument. Istnieją cztery zdefiniowane cele, a każda nazwa celu zaczyna się znakiem podkreślenia (_) :

• _blank — otwiera połączony dokument w nowym oknie lub karcie.
• _parent — otwiera połączony dokument w oknie nadrzędnym.
• _self — otwiera połączony dokument w tym samym oknie lub karcie, Co dokument źródłowy. Jest to wartość domyślna, dlatego nie jest konieczne jawne określanie tej wartości.
• _top — otwiera połączony dokument w pełnym oknie przeglądarki.

Wypróbuj poniższy przykład, aby zrozumieć, jak działa docelowy link:

<a href="/about-us.php" target="_top">About Us</a><a href="https://www.google.com/" target="_blank">Google</a><a href="images/sky.jpg" target="_parent"> <img src="sky-thumb.jpg" alt="Cloudy Sky"></a>

tworzenie Kotwic zakładek

możesz również tworzyć kotwice zakładek, aby umożliwić użytkownikom przejście do określonej sekcji strony internetowej. Zakładki są szczególnie pomocne, jeśli masz bardzo długą stronę internetową.

tworzenie zakładek to dwuetapowy proces: najpierw Dodaj atrybut id do elementu, do którego chcesz przeskoczyć, a następnie użyj wartości atrybutu id poprzedzonej znakiem skrótu (#) jako wartości atrybutu href znacznika <a>, jak pokazano w poniższym przykładzie:

<a href="#sectionA">Jump to Section A</a><h2>Section A</h2><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit...</p>

tworzenie linków do pobrania

Możesz również utworzyć link do pobrania pliku w dokładnie taki sam sposób, jak umieszczanie linków tekstowych. Po prostu wskaż docelowy adres URL pliku, który chcesz pobrać.

w poniższym przykładzie stworzyliśmy linki do pobierania plików ZIP, PDF i JPG.

<a href="downloads/test.zip">Download Zip file</a><a href="downloads/masters.pdf">Download PDF file</a><a href="downloads/sample.jpg">Download Image file</a>