如何添加带有 HTML 页面标题的图像？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10665893/
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
How to add image with title of an HTML page?
提问by Md.Shadab Akhtar
How to add image or logo of a page with the title of that page which is displayed with the title in chrome, firefox or other browsers?
如何添加带有该页面标题的页面的图像或徽标，该页面的标题在 chrome、firefox 或其他浏览器中显示？
回答by Rahul
Taken from What is Favicon.ico and How to Create a Favicon Icon for Your Website
取自什么是 Favicon.ico 以及如何为您的网站创建 Favicon 图标
How to Create a "Favicon.ico" File
1.Create an image 16X16 pixels in size. Yes, it is really small and you can't really draw much in it. You should also restrict yourself to the standard Windows 16 colours, although I suspect that 256 colours will work fine.
If you like, you can also create a 32X32 pixel icon, which will be scaled to size for the Favorites menu and the location bar. You can even put both 16X16 and 32X32 pixel icons into the same icon file. Windows will use the former for its menus and the latter when the user opens up a folder that is set to display large icons. It's probably not really necessary to do this if you can't be bothered.
2.Save the image as an ICO file (named "favicon.ico", of course).
3.Upload it to your website. You don't need to upload one to every directory of your site if you don't want to waste space - simply put it in your root directory and the web browsers that support favicons will apparently locate it eventually. You can also upload it into your images directory, but you will need to modify your web pages if you do. See later in this article for more information on this.
Help! My Web Host Doesn't Allow ICO Files!
If your hosting company does not allow files with the .ICO extension to be uploaded, you might try to work around it by uploading it (in binary mode) with some other extension (like GIF). Once it's on your site, rename it using your FTP program to the correct extension.
如何创建“Favicon.ico”文件
1.创建一个大小为 16X16 像素的图像。是的，它真的很小，你真的不能在里面画很多东西。您还应该限制自己使用标准的 Windows 16 色，尽管我怀疑 256 色可以正常工作。
如果您愿意，您还可以创建一个 32X32 像素的图标，该图标将根据收藏夹菜单和位置栏的大小进行缩放。您甚至可以将 16X16 和 32X32 像素图标放入同一个图标文件中。Windows 将在其菜单中使用前者，而在用户打开设置为显示大图标的文件夹时使用后者。如果您不受打扰，可能没有必要这样做。
2.将图像另存为 ICO 文件（当然名为“favicon.ico”）。
3.将其上传到您的网站。如果您不想浪费空间，则无需将一个上传到站点的每个目录 - 只需将其放在您的根目录中，支持网站图标的 Web 浏览器显然最终会找到它。您也可以将其上传到您的图像目录中，但如果这样做，您将需要修改您的网页。有关这方面的更多信息，请参阅本文后面部分。
帮助！我的虚拟主机不允许 ICO 文件！
如果您的托管公司不允许上传带有 .ICO 扩展名的文件，您可以尝试通过使用其他扩展名（如 GIF）上传（以二进制模式）来解决这个问题。一旦它在您的站点上，请使用您的 FTP 程序将其重命名为正确的扩展名。
<head>
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
</head>
回答by Ste
What you are looking for is a favicon.
您正在寻找的是一个图标。
The preferred way to add this, as guided by the W3 consortium, is to use a profilein your page <head>tags:
根据 W3 联盟的指导，添加此项的首选方法是profile在您的页面<head>标签中使用 a ：
<head profile="http://www.yoursite.com/profile">
<link rel="icon"
type="image/png"
href="http://example.com/myicon.png">
[…]
</head>
See herefor instructions for adding to your site.
有关添加到您的站点的说明，请参见此处。
回答by Ajeet
Here is the code for Setting your favicon for your website. Your favicon will be display along with specified webpage title. Just use following codes.
这是为您的网站设置图标的代码。您的网站图标将与指定的网页标题一起显示。只需使用以下代码。
<!DOCTYPE html>
<html>
<head>
<title> mytitle </title>
<link rel="icon" href="http://i58.tinypic.com/302rtyg.png" type="image/png">
</head>
</html>
回答by mathmaniac88
Here is a really easy site I use to creat my favicons: favicon.cc
这是我用来创建我的收藏夹的一个非常简单的网站：favicon.cc
Here are its advantages:
以下是它的优点：
Remember to give each one unique name such as default.ico or blog.ico
记得给每一个唯一的名字，比如 default.ico 或 blog.ico
Remember to download your favicons.
Here is how you access the favicons:
记得下载你的收藏夹。
以下是访问收藏夹图标的方法：
<link href="/YOUR_PATH/favicon.ico" rel="icon" type="image/x-icon" />
回答by Dileep
<head>
<link rel="shortcut icon" href="title_icon.png">
</head>
回答by Rumi singh
<link rel="icon" href="image_name.ico" />
<title>Place your html title here</title>
Here link specify relation between current resource which is icon .href gives address of image to browser.Image can be of any type eg: jpg format
这里链接指定当前资源之间的关系，即图标 .href 将图像地址提供给浏览器。图像可以是任何类型，例如：jpg 格式
