Таг link
Тагът link свързва CSS файлове към HTML
страница. Освен това, link свързва
някои други файлове, например, фавикон.
(Фавиконът е иконка на сайта, която се
вижда в раздела на браузъра. Тя също може да бъде
видяна в някои търсачки при търсене
до сайтовете, например в Yandex).
Този таг има много атрибути и те могат да приемат разнообразни стойности, но в реалния живот те почти не се използват. Най-популярните - това са свързването на CSS и добавянето на фавикон.
Как да свържете CSS:
<link rel="stylesheet" href="style.css">
Как да свържете фавикон:
<link href="favicon.ico" rel="shortcut icon" type="image/x-icon">
Тагът link не изисква затварящ таг.
Атрибути
| Атрибут | Описание |
|---|---|
href |
Пътят към свързвания файл. |
media |
Типът устройство, за което трябва да се свърже файлът. Какво се има предвид - можете да свържете CSS файл само за големи екрани (стойност screen)
или само за малки екрани: за мобилни телефони или таблети (стойност handheld).
Възможни стойности: all, braille, handheld, print, screen, speech, projection, tty, tv.
Вижте по-долу за повече подробности.
|
rel |
Типът на свързвания файл.
Възможни стойности: stylesheet | alternate.
Стойността stylesheet показва, че се свързва CSS файл,
стойността alternate се използва, например, за посочване на връзка
към файл във формат XML за описание на новинарски емисии, анонси на статии.
|
charset |
Кодировката на свързвания файл.
В настоящия момент стандартът е utf-8.
|
type |
Типът данни на свързвания файл. |
Стойности на атрибута media
В HTML5 като стойности могат да бъдат посочени медийни заявки.
| Стойност | Описание |
|---|---|
all |
Всички устройства. |
screen |
Екран на монитор. |
handheld |
Телефони, смартфони, устройства с малък екран. |
braille |
Устройства, базирани на системата Брайл, предназначени за слепи хора. |
speech |
Речеви синтезатори, както и програми за възпроизвеждане на текст на глас. Тук се включват и речеви браузъри. |
print |
Принтери. |
projection |
Проектори. |
tty |
Телетайпи, терминали, портативни устройства с ограничени възможности на екрана. За тях не трябва да се използват пиксели като мерни единици. |
tty |
Телевизори, които могат да отварят web страници (има и такива). |
Стойност по подразбиране: all.
Пример
Нека да разгледаме как изглежда структурата на най-простата HTML страница, към която добавяме свързване на CSS файлове и фавикон:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style1.css">
<link rel="stylesheet" href="style2.css" media="screen">
<link href="favicon.ico" rel="shortcut icon" type="image/x-icon">
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
</html>