Как добавить изображение в строку заголовка с помощью html?

<DOCTYPE! HTML>
<html>
<head>
    <title>Login</title>
    <link rel="icon" href="favicon.ico" type="image/x-icon">
</head>
<body>
    some text

</body>
</html>

Это код, который я написал для добавления изображения в новую панель вкладок браузера. Но это не работает. Я также использую wamp-сервер, если wamp может вызвать проблемы.

Ответ 1

Согласно wikipedia, наиболее совместимое с браузером заклинание:

<link rel="shortcut icon" href="favicon.ico" />

После этого вам просто нужно беспокоиться о том, действительно ли ваш браузер загружает значок. Что говорят серверные журналы? Вы проверили консоль отладки сети браузеров?

Ответ 2

W3C говорит:

<!DOCTYPE html 
      PUBLIC "-//W3C//DTD HTML 4.01//EN"
      "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-US">
<head profile="http://www.w3.org/2005/10/profile">
<link rel="icon" 
      type="image/png" 
      href="http://example.com/myicon.png">
[…]
</head>
[…]
</html>

См. http://www.w3.org/2005/10/howto-favicon

Но имейте в виду: некоторым браузерам нужно некоторое время признать, что есть значок - попробуйте удалить куки и снова открыть свой сайт! (И убедитесь, что значок находится на пути:))

Ответ 3

Попробуйте следующее:

<link rel="icon" type="image/png" href="img/iconimg.png" />

NB: href - это каталог вашего примера с изображением. Ваше изображение находится в папке с именем "img", а ваше изображение "iconimg", и если это png use .png, если это jpg, то .jpg. Не забудьте сделать это в главном файле, а не в теле.

Ответ 4

у вас есть заглавные буквы для html.You написал это как ЭТО НЕ ИСПРАВЛЯЕТ!!! ваш браузер не поймет это как html5.

Ответ 5

Используйте следующие

1.) Выберите изображение, которое вы хотите установить в строке заголовка.
2.) Преобразуйте его в формат ".ico". (Вы можете использовать следующую ссылку онлайн) http://image.online-convert.com/convert-to-ico
3.) Сохраните файл как "favicon.ico" в той же папке, что и ваш .html файл
4.) Добавьте это в свой тег головы <link rel="shortcut icon" href="favicon.ico"/>

Ответ 6

Показать изображение в строке заголовка легко. выполните следующие действия:

a) сначала сохраните изображение, где в папке и имени, например, значок. b) затем используйте нижнюю строку внутри основного тега представления html

<link rel="icon" type="image/png" href="image_url" />

c) Здесь вы должны знать путь к файлу, в котором вы сохранили изображение d) сохраните URL-адрес изображения вместо image_url e) сохраните свою работу.

Ответ 7

работает

Добавьте это в свой тег заголовка

<link rel="shortcut icon" href="http://example.com/myicon.png" />

Ответ 8

Попробуйте этот полный ответ,

<html>
 <head>
  <link rel="icon" href="Image path" type="image/gif" sizes="16x16">
 </head>
 <body>
   Something
 </body>
</html>

Путь к изображению -: /images/title_icon.png как этот

Ссылка -: w3school

Ответ 9

Я просто попытался с этим кодом, и он работал у меня: <link rel="icon" type="image/jpg" href="C:\Users\nrm05\Pictures\logo.jpg" /> Обязательно введите type="image/jpg" для файлов jpg и type="image/png" для файлов PNG. Если вы не загрузили изображение, но знаете URL-адрес изображения, вы можете ввести его следующим образом: href="image_url"

Надеюсь, это ответили на ваш вопрос: -)

Ответ 10

Я попытался в своем проекте angular7, написав эти строки и работал.

<link rel="icon" type="image/x-icon" href="filepath/filename.ico">

обратите внимание, что файл изображения должен быть в формате значка (.ico)