Зображення поруч із заголовком сторінки на вкладці браузера - як тут можна пов’язати зображення?
Відповіді:
Це зображення називається " значок ", і це невеликий .icoфайл квадратної форми , який є стандартним типом файлу для значків. Ви можете використовувати .pngабо .gifтеж, але для кращої сумісності слід дотримуватися стандартів.
Щоб встановити його для свого веб-сайту, вам слід:
Створіть квадратне зображення вашого логотипу (бажано 32x32 або 16x16 пікселів, наскільки я знаю, що немає максимального розміру *), і перетворіть його у .icoфайл. Ви можете зробити це на Gimp, Photoshop (за допомогою плагіна ) або на веб-сайті, наприклад Favicon.cc або RealFaviconGenerator .
Тоді у вас є два способи його налаштування:
A) Розміщення його у кореневій папці / каталозі вашого веб-сайту (поруч index.html) із назвою favicon.ico.
або
Б) Посилання на нього між <head></head>тегами кожного .htmlфайлу на вашому сайті, наприклад:
<head>
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />
</head>Якщо ви хочете переглянути це faviconз будь-якого веб-сайту, просто напишіть, www.url.com/favicon.icoі ви (ймовірно) побачите його. Значок Stackoverflow - 16x16 пікселів, а Вікіпедія - 32x32.
*: Існує навіть проблема браузера без обмеження розміру файлу. Ви можете легко розбити веб-переглядач із надзвичайно великим значком, докладніше тут
Це називається " favicon ", і вам потрібно додати код нижче до заголовка вашого веб-сайту.
Просто додайте це до <head>розділу.
<link rel="icon" href="/your_path_to_image/favicon.jpg">Це значок і пояснюється у посиланні.
наприклад, від W3C
<link rel="icon"
type="image/png"
href="http://example.com/myicon.png">Плюс, звичайно, файл зображення у відповідному місці.
<link rel="apple-touch-icon" sizes="114x114" href="${resource(dir: 'images', file:
'apple-touch-icon-retina.png')}">або ви можете використовувати цей
<link rel="shortcut icon" sizes="114x114" href="${resource(dir: 'images', file: 'favicon.ico')}"
type="image/x-icon">Додайте файл значка з назвою "favicon.ico" до кореневої сторінки вашого веб-сайту.
16x16 px.