linki adsense

wtorek, 11 grudnia 2012

KURS HTML - LINKI

Linki można znaleźć na prawie każdej stronie internetowej. Linki pozwalają użytkownikowi przenosić się z jednej strony WWW na inną.



Przyklady - Spróbuj sam


Linki HTML
Jak tworzyć linki w dokumencie HTML.

(Na końcu posta znajduje się więcej przykładów)



Hiperlinki (linki) HTML


Znacznik <a> definiuje hiperlink.
Hiperlink (lub link) to słowo, grupa słów, lub obrazek który możesz kliknąć żeby przeskoczyć do innego dokumentu HTML.
Jeśli przesuniesz kursor nad link na stronie, strzałka zmieni się w małą rękę.
Najważniejszym atrybutem znacznika <a> jest atrybut href, który wskazuje cel linka.
Standardowo w przeglądarkach linki wyglądają następująco:

  • Nie odwiedzony link jest niebieski i podkreślony
  • Odwiedzony link jest purpurowy i podkreślony
  • Link aktywny jest czerwony i podkreślony



Składnia Linka HTML


Kod HTML dla linka jest prosty. Wygląda tak:

<a href="url">tekst linka</a>
Atrybut href określa cel linka.


Przykład



<a href="http://www.w3schools.com/">Visit W3Schools</a>
który wyświetla się tak: Visit W3Schools
Kliknięcie tego linka przeniesie na stronę domową W3Schools.

Uwaga: "tekst linka" nie musi być tekstem. Może być obrazkiem lub innym elementem HTML.



Linki HTML - Atrybut target


Atrybut target określa gdzie ma być otwarty dokument HTML wskazany przez linka.
Poniższy przykład będzie otwierał dokument w nowym oknie przeglądarki lub w nowej karcie:


Przykład


<a href="http://www.w3schools.com/" target="_blank">Visit W3Schools!</a>

SPRÓBUJ SAM »




Linki HTML - Atrybut id


Atrybut id może być użyty do stworzenia zakładki wewnątrz dokumentu HTML.
Uwaga: Zakładki nie są wyświetlane w żaden specjalny sposób. Są niewidzialne dla czytelnika.


Przykład


Odsyłacz z id wewnątrz dokumentu HTML:

<a id="porady">Sekcja przydatnych porad</a>
Stworzenie linka do "Sekcji przydatnych porad" wewnątrz tego samego dokumentu:

<a href="#porady">Odwiedź sekcję przydatnych porad</a>
Lub stworzenie linka do "Sekcji przydatnych porad" z innej strony internetowej:

<a href="http://www.w3schools.com/html_links.htm#porady">Odwiedź sekcję przydatnych porad</a>




Użyteczne porady


Uwaga: Zawsze dodawaj znak slash do podfolderu odniesienia. Jeśli stworzysz linka w ten sposób: href="http://www.w3schools.com/html", wygenerujesz dwa żądania do serwera, serwer najpierw doda znak slahs do adresu, a potem stworzy nowe żąda: href="http://www.w3schools.com/html/".



Więcej przykładów


Obrazek jako link
Jak użyć obrazka jako link.

Link do miejsca na tej samej stronie internetowej
Jak stworzyć link do zakładki.

Wydostanie się z ramki
Jak wydostać się z ramki (jeśli twoja strona jest zamknięta w ramce).

Tworzenie linka wysyłania wiadomości (mailto)
Jakl stworzyć linka do wysyłania wiadomości mail (będzie działać jeśli masz zainstalowanego i skonfigurowanego klienta pocztowego).

Tworzenie linka wysyłającego wiadomość 2
Inny link wiadomości mail.



Znacznik linka HTML



ZnacznikOpis
<a>Definiuje hiperlink

9 komentarzy:

  1. Jestem pod wrażeniem. Świetny artykuł.

    OdpowiedzUsuń
  2. Bardzo przydatne podstawy HTML gdyż w sumie trzeba to umieć jeśli ktoś chce również pozycjonować strony www samodzielnie. Jak oglądałem niedawno sesję pytań i odpowiedzi https://www.zgred.pl/porady-seo/pozycjonowanie-bloga-sesja-q-a/ to już teraz doskonale rozumiem jak to robić, aby pozycjonowanie bloga było skuteczne.

    OdpowiedzUsuń
  3. Uwielbiam odwiedzać Twojego bloga, ponieważ dodajesz naprawdę ciekawe wpisy. Myśle, że wiele osób jest pod wrażeniem.

    OdpowiedzUsuń
  4. To nie są moje artykuły, tylko tłumaczenie tutoriala z W3Schools z angielskiego na polski.
    Jeśli umiesz czytać po angielsku to cały tutorial jest tu:https://www.w3schools.com/
    W3shools to świetna strona, dlatego postanowiłem przetłumaczyć ich tutoriale na język polski. Niestety obecna praca nie pozwala mi się już tym zajmować (brak czasu).

    OdpowiedzUsuń
  5. Solidnie napisane. Pozdrawiam i liczę na więcej ciekawych artykułów.

    OdpowiedzUsuń
  6. Przydatne informacje, ciekawy post

    OdpowiedzUsuń
  7. Świetny tekst! Od roku nie czytałam tak wartościowego artykułu.

    OdpowiedzUsuń
  8. Ogólnie taka nauka na pewno jest ważna, ale myślę, że także fajnym rozwiązaniem jest skorzystanie z usług zaufanej agencji reklamowej. Ja mogę na pewno każdemu polecić świetną agencję https://haiku.com.pl/ która już nie raz dla mnie wykonywała strony internetowe.

    OdpowiedzUsuń