Samouczek HTML

Strona główna HTML Wprowadzenie do HTML Edytory HTML Podstawy HTML Elementy HTML Atrybuty HTML Nagłówki HTML Akapity HTML Style HTML Formatowanie HTML Cytaty HTML Komentarze HTML Kolory HTML HTML CSS Linki HTML Obrazy HTML Ulubione HTML Tabele HTML Listy HTML Blok HTML i wbudowany Klasy HTML Identyfikator HTML Ramki HTML HTML JavaScript Ścieżki plików HTML Nagłówek HTML Układ HTML HTML Responsywne Kod komputerowy HTML Semantyka HTML Przewodnik po stylach HTML Jednostki HTML Symbole HTML Emotikony HTML Zestaw znaków HTML Kodowanie adresu URL HTML HTML a XHTML

Formularze HTML

Formularze HTML Atrybuty formularza HTML Elementy formularza HTML Typy danych wejściowych HTML Atrybuty wejściowe HTML Atrybuty formularza wejściowego HTML

Grafika HTML

Płótno HTML HTML SVG

Media HTML

Media HTML Wideo HTML Dźwięk HTML Wtyczki HTML HTML YouTube

API HTML

Geolokalizacja HTML Przeciągnij/upuść HTML Magazyn sieciowy HTML HTML Web Workers HTML SSE

Przykłady HTML

Przykłady HTML Quiz HTML Ćwiczenia HTML Certyfikat HTML Podsumowanie HTML Dostępność HTML

Odniesienia HTML

Lista znaczników HTML Atrybuty HTML Globalne atrybuty HTML Obsługa przeglądarki HTML Zdarzenia HTML Kolory HTML Płótno HTML HTML audio/wideo Dokumenty HTML Zestawy znaków HTML Kodowanie adresu URL HTML Kody językowe HTML Wiadomości HTTP Metody HTTP Konwerter PX na EM Skróty klawiszowe

Ulubione HTML


Favikona to mały obrazek wyświetlany obok tytułu strony w zakładce przeglądarki.


Jak dodać favicon w HTML

Jako favicon możesz użyć dowolnego obrazu. Możesz także stworzyć własną favicon na stronach takich jak https://favicon.cc .

Wskazówka: favikona to mały obraz, więc powinien to być prosty obraz o wysokim kontraście.

Obraz favicon jest wyświetlany po lewej stronie tytułu strony na karcie przeglądarki, w następujący sposób:

Przykład favicon

Aby dodać favicon do swojej witryny, zapisz obraz favicon w katalogu głównym serwera WWW lub utwórz folder w głównym katalogu o nazwie images i zapisz obraz favicon w tym folderze. Popularna nazwa obrazu favicon to „favicon.ico”.

Następnie dodaj <link>element do swojego pliku „index.html”, po <title>elemencie, w ten sposób:

Przykład

<!DOCTYPE html>
<html>
<head>
  <title>My Page Title</title>
  <link rel="icon" type="image/x-icon" href="/images/favicon.ico">
</head>
<body>

<h1>This is a Heading</h1>
<p>This is a paragraph.</p>

</body>
</html>

Teraz zapisz plik „index.html” i załaduj go ponownie w przeglądarce. Twoja karta przeglądarki powinna teraz wyświetlać obraz favicon po lewej stronie tytułu strony.


Obsługa formatu pliku Favicon

W poniższej tabeli przedstawiono obsługę formatu pliku dla obrazu favicon:

Browser ICO PNG GIF JPEG SVG
Edge Yes Yes Yes Yes Yes
Chrome Yes Yes Yes Yes Yes
Firefox Yes Yes Yes Yes Yes
Opera Yes Yes Yes Yes Yes
Safari Yes Yes Yes Yes Yes

Podsumowanie rozdziału

  • Użyj elementu HTML <link>, aby wstawić favicon

Znacznik linku HTML

Tag Description
<link> Defines the relationship between a document and an external resource

Pełną listę wszystkich dostępnych tagów HTML można znaleźć w naszym podręczniku HTML Tag Reference .