Html 使用带有 css 的图标

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/8687440/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 12:14:33  来源:igfitidea点击:

using favicon with css

htmlcssfavicon

提问by PA.

I want to set the favicon for a fairly large number of pages. But, instead of using the HTML <head>tag <link rel="shortcut icon" href="favicon.ico">, I'd like to set it in the CSS file. I have limited access to some of the html files, and limited control to their life cycle.

我想为相当多的页面设置图标。但是,我想在 CSS 文件中设置它,而不是使用 HTML<head>标签<link rel="shortcut icon" href="favicon.ico">。我对某些 html 文件的访问权限有限,对其生命周期的控制也有限。

回答by Oded

You can't set a favicon from CSS - if you want to do this explicitly you have to do it in the markup as you described.

您不能从 CSS 设置图标 - 如果您想明确地执行此操作,则必须按照您的描述在标记中执行此操作。

Most browsers will, however, look for a favicon.icofile on the root of the web site - so if you access http://example.commost browsers will look for http://example.com/favicon.icoautomatically.

但是,大多数浏览器会favicon.ico在网站的根目录中查找文件 - 因此,如果您访问http://example.com,大多数浏览器会自动查找http://example.com/favicon.ico

回答by Rich Bradshaw

You don't need to - if the favicon is place in the root at favicon.ico, browsers will automatically pick it up.

您不需要 - 如果 favicon 位于 favicon.ico 的根目录中,浏览器将自动选取它。

If you don't see it working, clear your cache etc, it does work without the markup. You only need to use the code if you want to call it something else, or put it on a CDN for instance.

如果你没有看到它工作,清除你的缓存等,它可以在没有标记的情况下工作。如果您想将其称为其他名称,或者将其放在 CDN 上,您只需要使用该代码。

回答by NerdBar

If (1) you need a favicon that is different for some parts of the domain, or (2) you want this to work with IE 8 or older (haven't tested any newer version), then you have to edit the html to specify the favicon

如果(1)您需要一个对于域的某些部分不同的图标,或者(2)您希望它与 IE 8 或更旧版本(尚未测试任何更新版本)一起使用,那么您必须将 html 编辑为指定网站图标

回答by TheDunadan

There is no explicit way to change the favicon globally using CSS that I know of. But you can use a simple trick to change it on the fly.

没有明确的方法可以使用我所知道的 CSS 全局更改收藏夹图标。但是您可以使用一个简单的技巧来即时更改它。

First just name, or rename, the favicon to "favicon.ico" or something similar that will be easy to remember, or is relevant for the site you're working on. Then add the link to the favicon in the head as you usually would. Then when you drop in a new favicon just make sure it's in the same directory as the old one, and that it has the same name, and there you go!

首先,将网站图标命名或重命名为“favicon.ico”或易于记忆的类似内容,或者与您正在处理的网站相关。然后像往常一样添加指向头部图标的链接。然后,当您放入一个新的图标时,只需确保它与旧的位于同一目录中,并且名称相同,就可以了!

It's not a very elegant solution, and it requires some effort. But dropping in a new favicon in one place is far easier than doing a find and replace of all the links, or worse, changing them manually. At least this way doesn't involve messing with the code.

这不是一个非常优雅的解决方案,它需要一些努力。但是在一个地方放置一个新的图标比查找和替换所有链接要容易得多,或者更糟的是,手动更改它们。至少这种方式不涉及弄乱代码。

Of course dropping in a new favicon with the same name will delete the old one, so make sure to backup the old favicon in case of disaster, or if you ever want to go back to the old design.

当然,放入同名的新图标会删除旧的图标,因此请务必备份旧图标,以防万一,或者如果您想回到旧设计。