有一个凹痕表明我的favicon被加载了,但是我没有看到favicon,而是看到了favicon应该在的一个完全空白的区域。图片是38x48,但我也试过32x32。48x48约为10kb,32x32约为5kb。这肯定不是一个空白/透明的图像。
这就是我在加载favicon时看到的:
这就是我不装favicon时看到的:
你能看出区别吗?我应该看到一张照片,一片树叶用鸟的唾液包裹着婴儿的脸颊,这些唾液已经变成了蜂蜜。
*我把这个放在了合规性之下,因为我认为这可能是一个图像大小、尺寸或其他一些非常琐碎的问题。
这是头。我想知道是不是因为我在中国,W3C可能无法访问。。。。下一步我要试试怪癖模式。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-GB">
<head>
<title>...</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
<meta name="description" content="..." />
<meta name="keywords" content="..." />
<link rel="icon" type="image/x-icon" href="/index.ico" />
<!-- Style link START -->
<link rel=stylesheet media="screen" type="text/css" size="48x48" href="screen.css">
<!-- Style link END -->
</head>
最佳答案
对于不同类型的浏览器,favicon必须有不同的大小。
每个浏览器的大小都要正确,这一点很重要。
您似乎在使用mozilla,因此请使用以下图像:
16 x 16个
32 x 32英寸
48 x 48个
62 x 62英寸
全部以像素为单位。
代码如下:
<!-- For IE 11, Chrome, Firefox, Safari, Opera -->
<link rel="icon" href="path/to/favicon-16.png" sizes="16x16" type="image/png">
<link rel="icon" href="path/to/favicon-32.png" sizes="32x32" type="image/png">
<link rel="icon" href="path/to/favicon-48.png" sizes="48x48" type="image/png">
<link rel="icon" href="path/to/favicon-62.png" sizes="62x62" type="image/png">
<!-- More info: https://bitsofco.de/all-about-favicons-and-touch-icons/ -->
希望这行得通。
关于html - Favicon是否完全透明?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/36855156/