Html 在标题栏中添加图像
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/15786937/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Add image in title bar
提问by Manoz
How do I add image in title bar?
如何在标题栏中添加图像?
I have title- "Webnet"
我有标题-“Webnet”
Merging it with a FontAwesome Glyphicon's icon images as-
将它与 FontAwesome Glyphicon 的图标图像合并为 -
<title><i class="icon-user icon-black"></i>Webnet</title>
And I tried it replacing with image source-
我尝试用图像源替换它-
<title><img src="assests/img/user-Hermosillo.png" ></img>Webnet</title>
But title shows innerHTML instead of showing image there.
但是标题显示了innerHTML 而不是在那里显示图像。
Any help?
有什么帮助吗?
回答by Samuel MacLachlan
That method will not work. The <title>
only supports plain text. You will need to create an .ico
image with the filename of favicon.ico
and save it into the root folder of your site (where your default page is).
这种方法是行不通的。在<title>
只支持纯文本。您需要创建一个.ico
文件favicon.ico
名为的图像并将其保存到您站点的根文件夹中(您的默认页面所在的位置)。
Alternatively, you can save the icon where ever you wish and call it whatever you want, but simply insert the following code into the <head>
section of your HTML and reference your icon:
或者,您可以将图标保存在您想要的任何位置并随意命名,但只需将以下代码插入<head>
HTML 部分并引用您的图标:
<link rel="shortcut icon" href="your_image_path_and_name.ico" />
You can use Photoshop (with a plug in) or GIMP (free) to create an .ico
file, or you can just use IcoFX, which is my personal favourite as it is really easy to use and does a great job (you can get an older version of the software for free from download.com).
您可以使用 Photoshop(带插件)或 GIMP(免费)来创建.ico
文件,或者您可以只使用IcoFX,这是我个人最喜欢的,因为它非常易于使用并且做得很好(您可以使用更老的从download.com免费下载该软件的版本)。
Update 1:You can also use a number of online tools to create favicons such as ConvertIcon, which I've used successfully. There are other free online tools available now too, which do the same (accessible by a simple Google search), but also generate other icons such as the Windows 8/10 Start Menu icons and iOS App Icons.
更新 1:您还可以使用许多在线工具来创建图标,例如我已经成功使用的ConvertIcon。现在还有其他免费的在线工具可用,它们的功能相同(可通过简单的 Google 搜索访问),但还会生成其他图标,例如 Windows 8/10 开始菜单图标和 iOS 应用程序图标。
Update 2:You can also use .png
images as icons providing IE11 is the only version of IE you need to support. You just need to reference them using the HTML code above. Note that IE10 and older still require .ico
files.
更新 2:您还可以使用.png
图像作为图标,前提是 IE11 是您需要支持的唯一 IE 版本。您只需要使用上面的 HTML 代码引用它们。请注意,IE10 及更早版本仍然需要.ico
文件。
回答by karthick
Add this in the head section of your html
将此添加到您的 html 的 head 部分
<link rel="icon" type="image/gif/png" href="mouse_select_left.png">
回答by nandu
you should be searching about how to add favicon.ico
. You can try adding favicon.ico
directly in your html pages like this
您应该正在寻找如何添加favicon.ico
. 您可以尝试favicon.ico
像这样直接在 html 页面中添加
<link rel="shortcut icon" href="/favicon.png" type="image/png">
<link rel="shortcut icon" type="image/png" href="http://www.example.com/favicon.png" />
Or you can update that in your webserver
. It is advised to add in your webserver
as you don't need to add this in each of your html
pages (assuming no includes
).
或者您可以在您的webserver
. 建议添加您的,webserver
因为您不需要在每个html
页面中添加它(假设没有includes
)。
To add in your apache
place the favicon.ico
in your root website director and add this in httpd.conf
要在您的根网站目录中添加您的apache
位置并将其favicon.ico
添加到 httpd.conf 中
AddType image/x-icon .ico
回答by errieman
You'll have to use a favicon for your page.
put this in the head-tag:
<link rel="shortcut icon" href="/favicon.png" type="image/png">
您必须为您的页面使用图标。把它放在头标签中:
<link rel="shortcut icon" href="/favicon.png" type="image/png">
where favicon.png is preferably a 16x16 png image.
其中 favicon.png 最好是 16x16 png 图像。