Link rel Stylesheet, Icon – HTML

Link rel HTML

<link>

Element <link> używany jest w celu importu zewnętrznych zewnętrznych plików na stronę internetową. Najczęście stosuje się go w celu:

• importu zewnętrznego pliku CSS
• dołączenia Favicona

<!-- Plik CSS -->
<link rel="stylesheet" href="...">

<!-- Favicon -->
<link rel="icon" href="..." type="image/x-icon">

Element <link> może mylić się nam ze znanymi nam już linkami, jednak są to dwie zupełnie różne rzeczy. Pamiętajmy, że linki służące do nawigacji po stronie to element <a>.

Link rel stylesheet – pliki CSS

<link rel="stylesheet">

Pliki, które najczęściej będziemy importować z zewnętrznych źródeł to pliki CSS. Odwołanie do pliku znajdującego się na naszym serwerze możemy zapisać następująco.

<link rel="stylesheet" href="css/main.css">

Atrybut rel (skrót od relation, czyli powiązanie) wskazuje w jaki sposób plik zewnętrzny wiąże się ze stroną. W tym przypadku wartość atrybutu rel to stylesheet, czyli plik ze stylami.

Favicon

<link rel="icon">

Kolejnym popularnym zastosowaniem elementu link, jest dodanie do strony małej ikonki służącej lepszej identyfikacji strony. Wyświetlana jest na karcie strony przed tytułem strony.

Jest to tzw. favicon (ang. favorites icon – ikona ulubionych). Rozmiary favicona są niezwykle małe i wynoszą jedynie 16px na 16px. Jednak jest to rewelacyjna forma odróżniania swojej strony od innych.

<link rel="icon" href="img/favicon.png" type="image/x-icon">

Najczęściej zapisywana jest właśnie jako favicon w celu rozróżnienia od innych ikon, ale nie jest to konieczne. Jeśli nie dodamy favicona do naszej strony, zostanie wyświetlona domyślna zaślepka, która zazwyczaj przyjmuje formę pustej karty.